Typography & Writing Formats
Heading 1 Heading 2 Heading 3 Heading 4 Heading 5 Heading 6 Simple paragraph: Lorem ipsum do…
Heading 1
Heading 2
Heading 3
Heading 4
Heading 5
Heading 6
Simple paragraph:
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin vestibulum
dignissim diam, et efficitur felis commodo et. Mauris vel diam pellentesque
lorem lacinia luctus. Nulla quam magna, pharetra in ultrices at, condimentum
id tellus. Sed suscipit sapien sed turpis ultrices viverra
Bold paragraph:
dignissim diam, et efficitur felis commodo et. Mauris vel diam pellentesque
lorem lacinia luctus. Nulla quam magna, pharetra in ultrices at, condimentum
id tellus. Sed suscipit sapien sed turpis ultrices viverra >
Italic paragraph:
dignissim diam, et efficitur felis commodo et. Mauris vel diam pellentesque
lorem lacinia luctus. Nulla quam magna, pharetra in ultrices at, condimentum
id tellus. Sed suscipit sapien sed turpis ultrices viverra >
Simple blockquote:
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin vestibulum
dignissim diam, et efficitur felis commodo et. Mauris vel diam pellentesque
lorem lacinia luctus. Nulla quam magna, pharetra in ultrices at, condimentum
id tellus. Sed suscipit sapien sed turpis ultrices viverra
Someone famous
Simple list:
- Viverra frills dignitaries quantum had.
- Proin been such bulla.
- Attack changed their directors.
Numbered list:
- Images back good information.
- Good information.
- How the whole world.
Accordings:
id="acc1"
name="accordion"
type="checkbox"
checked
/>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin vestibulum
dignissim diam, et efficitur felis commodo et. Mauris vel diam
pellentesque lorem lacinia luctus. Nulla quam magna, pharetra in ultrices
at, condimentum id tellus. Sed suscipit sapien sed turpis ultrices
viverra.
id="acc2"
name="accordion"
type="checkbox"
/>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin vestibulum
dignissim diam, et efficitur felis commodo et. Mauris vel diam
pellentesque lorem lacinia luctus. Nulla quam magna, pharetra in ultrices
at, condimentum id tellus. Sed suscipit sapien sed turpis ultrices
viverra.
id="acc3"
name="accordion"
type="checkbox"
/>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin vestibulum
dignissim diam, et efficitur felis commodo et. Mauris vel diam
pellentesque lorem lacinia luctus. Nulla quam magna, pharetra in ultrices
at, condimentum id tellus. Sed suscipit sapien sed turpis ultrices
viverra.
Syntax highlighter
>
function myFunction() {
var btn = document.getElementById("myButton");
if (btn.value == "Open button") {
btn.value = "Close button";
btn.innerHTML = "Close button";
}
else {
btn.value = "Open button";
btn.innerHTML = "Open button";
}
}Multi-tab syntax Highlighter
<!DOCTYPE html>
<html dir='ltr' lang='en'>
<head>
<title>Sample Page</title>
</head>
<!--[ <body> open ]-->
<body>
<p>Sample content here!</p>
</body>
<!--[ </body> close ]-->
</html>
/* Standar CSS */
::selection{color:#fff;background:var(--linkC)}
*, ::after, ::before{-webkit-box-sizing:border-box;}
h1, h2, h3, h4, h5, h6{margin:0;font-weight:700;}
h1{font-size:1.9rem}
h2{font-size:1.7rem}
h3{font-size:1.5rem}
h4{font-size:1.4rem}
h5{font-size:1.3rem}
h6{font-size:1.2rem}
a{color:var(--linkC);text-decoration:none}
a:hover{opacity:.9;transition:opacity .1s}
function myFunction() {
var btn = document.getElementById("myButton");
if (btn.value == "Open button") {
btn.value = "Close button";
btn.innerHTML = "Close button";
}
else {
btn.value = "Open button";
btn.innerHTML = "Open button";
}
}Spolier
Spoiler:
ShowLorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris consectetur at est quis ultricies. Nulla facilisi. Integer non consectetur orci. Mauris imperdiet quam nisl, et suscipit magna scelerisque sit amet. Morbi risus massa, iaculis nec porta vitae, luctus ac arcu. Nulla posuere luctus ex eu rhoncus. Sed eget erat a eros porttitor ullamcorper.
Buttons:
Simple button:
Click Here
Small button:
Click Here
Rounded button:
Click Here
Active button:
Click Here
Large button:
Click Here
Download button:
Download
Demo and Download button:
Demo
Download
Download button with file Details:
Note Block
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin vestibulum dignissim diam, et efficitur felis commodo et. Mauris vel diam pellentesque lor turpis ultrices viverra
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin vestibulum dignissim diam, et effnuirpis ferro ogronetlia visma potro ultrices viverra
Jawad Ahmed
"Pakistani blogger template designer with a focus on advanced UI/UX, SEO optimization, and blazing-fast performance along with SVG icons."...
Testing!
Tested reply!