Heading 1

Heading 2

Heading 3

Heading 4

Heading 5

Heading 6

                
  <h1>Heading 1</h1>
  <h2>Heading 2</h2>
  <h3>Heading 3</h3>
  <h4>Heading 4</h4>
  <h5>Heading 5</h5>
  <h6>Heading 6</h6>

Font Sizes

Three font sizes are available, use classes 'text-xl', 'text-lg', 'text-md', 'text-sm', 'text-xs' for extra large, large, medium, small and extra-small text.

Extra Large Text

Large Text

Medium Text

Small Text

Extra Small Text

                
  <div class="text-xl">Extra Large Text</div>
  <div class="text-lg">Large Text</div>
  <div class="text-md">Medium Text</div>
  <div class="text-sm">Small Text</div>
  <div class="text-xs">Extra Small Text</div>

Center Text

To create center text, use 'text-center' class.

Lorem ipsum dolor sit, amet consectetur adipisicing elit. Iusto asperiores officia impedit placeat excepturi aperiam quia, quam nam, ut eius ratione dolorum, consequuntur architecto debitis ullam ipsa quod soluta culpa!

                
  <div class="text-center"> 
    Lorem ipsum dolor sit, amet consectetur adipisicing elit. Iusto
    asperiores officia impedit placeat excepturi aperiam quia, quam
    nam, ut eius ratione dolorum, consequuntur architecto debitis
    ullam ipsa quod soluta culpa!
  </div>

Colored Text

To create colored text, use 'text-primary | text-grey | text-white | text-red' class.

Primary Text

Grey Text

White Text

Red Text

                
  <div class="text-primary">Primary Text</div>
  <div class="text-grey">Grey Text</div>
  <div class="text-white">White Text</div>
  <div class="text-red">Red Text</div>