Headings

Default

h1. Page heading

h2. Page heading

h3. Page heading

h4. Page heading

h5. Page heading
h6. Page heading
<h1>h1. Page heading</h1>
<h2>h2. Page heading</h2>
<h3>h3. Page heading</h3>
<h4>h4. Page heading</h4>
<h5>h5. Page heading</h5>
<h6>h6. Page heading</h6>

 

Heading-related styles for other inline elements

You can use different semantic classes to replicate heading styles for other textual tags like div, p, span, etc.

 

This paragraph is style like H6 heading.

This paragraph is style like H5 heading.

This paragraph is style like H4 heading.

This paragraph is style like H3 heading.

This paragraph is style like H2 heading.

This paragraph is style like H1 heading.

<p class="h6">This paragraph is style like H6 heading.</p>
<p class="h5">This paragraph is style like H5 heading.</p>
<p class="h4">This paragraph is style like H4 heading.</p>
<p class="h3">This paragraph is style like H3 heading.</p>
<p class="h2">This paragraph is style like H2 heading.</p>
<p class="h1">This paragraph is style like H1 heading.</p>

 

Display Headings

Display 1

Display 2

Display 3

Display 4

Display 5

Display 6

<h1 class="display-1">Display 1</h1>
<h1 class="display-2">Display 2</h1>
<h1 class="display-3">Display 3</h1>
<h1 class="display-4">Display 4</h1>
<h1 class="display-5">Display 5</h1>
<h1 class="display-6">Display 6</h1>

 

Heading For Paragraph Block.

Lorem Ipsum dolor sit

<div class="d-flex justify-content-center paragraph-heading-line-tiny">
  <div class="paragraph-heading-line mx-100 pt-100">
    <h2 class="text-color-catalina text-10">Lorem Ipsum dolor sit</h2>
  </div>
</div>