Elements / Typography

Headings

This is Heading 1

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Molestiae, eaque.

This is Heading 2

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sunt, voluptate.

This is Heading 3

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ullam, inventore.

This is Heading 4

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Cum, repellat.

This is Heading 5

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est, necessitatibus.

This is Heading 6

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Maiores, voluptatum!

Display Headings

Display 1

Display 2

Display 3

Display 4

Text Colors

.text-body

.text-body-light

.text-heading

.text-primary

.text-secondary

.text-success

.text-danger

.text-warning

.text-info

Other Text Elements

You can use the mark tag to highlight text.
This line of text is meant to be treated as deleted text use del tag.
This line of text is meant to be treated as an addition to the document use ins or u tag..
rendered as bold text use strongtag
rendered as italicized text use emtag
lowercase use class text-lowercase for lowercase text
uppercase use class text-uppercase for uppercase text
capitalize use class text-capitalize for capitalize text

Unordered

  • Lorem ipsum dolor sit amet
  • Consectetur adipisicing elit
  • Atque quasi totam recusandae ab
  • Minus illum exercitationem nihil
  • Nemo suscipit deserunt neque ut
    • Lorem ipsum dolor sit amet
    • Consectetur adipisicing elit
    • Atque quasi totam recusandae ab
    • Minus illum exercitationem nihil
  • Aspernatur quaerat et ipsa
  • Natus aut dolores esse
  • Aenean sit amet erat nunc

Ordered

  1. Lorem ipsum dolor sit amet
  2. Consectetur adipisicing elit
  3. Atque quasi totam recusandae ab
  4. Minus illum exercitationem nihil
  5. Nemo suscipit deserunt neque ut
    • Lorem ipsum dolor sit amet
    • Consectetur adipisicing elit
    • Atque quasi totam recusandae ab
    • Minus illum exercitationem nihil
  6. Aspernatur quaerat et ipsa
  7. Natus aut dolores esse
  8. Aenean sit amet erat nunc

Unstyled

  • Lorem ipsum dolor sit amet
  • Consectetur adipisicing elit
  • Atque quasi totam recusandae ab
  • Minus illum exercitationem nihil
  • Nemo suscipit deserunt neque ut
    • Lorem ipsum dolor sit amet
    • Consectetur adipisicing elit
    • Atque quasi totam recusandae ab
    • Minus illum exercitationem nihil
  • Aspernatur quaerat et ipsa
  • Natus aut dolores esse
  • Aenean sit amet erat nunc

List Check

  • Lorem ipsum dolor sit amet
  • Consectetur adipisicing elit
  • Atque quasi totam recusandae ab
  • Minus illum exercitationem nihil
  • Nemo suscipit deserunt neque ut
  • Aspernatur quaerat et ipsa
  • Natus aut dolores esse
  • Aenean sit amet erat nunc
How to Use

Use class list-icon list-check. Class list-icon is Common it need for the basic styles.

List Check All

  • Lorem ipsum dolor sit amet
  • Consectetur adipisicing elit
  • Atque quasi totam recusandae ab
  • Minus illum exercitationem nihil
  • Nemo suscipit deserunt neque ut
  • Aspernatur quaerat et ipsa
  • Natus aut dolores esse
  • Aenean sit amet erat nunc
How to Use

Use class list-icon list-ticked. Class list-icon is Common it need for the basic styles.

List Icon Class List

  • list-check
  • list-check-square
  • list-ticked
  • list-star
  • list-star-circle
  • list-arrow
  • list-caret
  • list-chevron
  • list-long-arrow
  • list-forward