Display 1

Display 2

Display 3

Display 4

Display 5

Display 6

---

This is a descriptive small sub-text

---

Heading Level 1

This is a standard paragraph following an H1. It’s good for testing spacing, line height, and font hierarchy.

Heading Level 2

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras vel sapien vel nisi sollicitudin egestas at non nulla.

Heading Level 3

Donec sagittis lectus at metus commodo, vel pulvinar nibh lacinia. Duis feugiat sapien a mi viverra, ut laoreet elit eleifend.

Heading Level 4

Vestibulum ac metus a elit pretium facilisis. Morbi ultricies, enim vitae facilisis commodo, justo lacus viverra lacus, vel tempor nisl justo in magna.

Heading Level 5

Praesent non leo et libero ultrices fermentum. Sed laoreet, libero at gravida malesuada, ligula libero placerat nulla, sed commodo velit ex id nisi.

---

This is a lead paragraph. It should stand out — slightly larger, lighter, or more spacious than the regular paragraph. Praesent non leo et libero ultrices fermentum. Sed laoreet, libero at gravida malesuada, ligula libero placerat nulla, sed commodo velit ex id nisi.

---

Strong text emphasizes importance. Emphasized text adds subtle stress. This is a sample link inside a paragraph.

---

“This is a sample blockquote. It’s used for citing quotes or highlighting important statements in your design.”

---

You can use the mark tag to highlight text.

This line of text is meant to be treated as deleted text.

This line of text is meant to be treated as no longer accurate.

This line of text is meant to be treated as an addition to the document.

This line of text will render as underlined.

This line of text is meant to be treated as fine print.

This line rendered as bold text.

This line rendered as italicized text.

---

This is small text, useful for meta info or footnotes.

---

Description lists

A description list is perfect for defining terms.

Euismod

Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.

Donec id elit non mi porta gravida at eget metus.

Malesuada porta

Etiam porta sem malesuada magna mollis euismod.

Truncated term is truncated

Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.

---

Here are the temed Lists. The class list-primary controls the color of the icon (in this case primary color - but could be secondary, danger, success, warning also).
The <li> class decides which Font Awesome Icon should be displayed. Choose from:

  check, time, location, envelope, phone, circle-chek, house, playbutton, circle, cube, area, expand, door, bed, building