Loading...

Elements Typography

Typography

We provide some basic styling to header tags. For example,
you can see 6 header tags' different sizes

H1 to H6 - Html typography

Heading h1

Heading h2

Heading h3

Heading h4

Heading h5
Heading h6
HTML Code:
<h1 class="fw-normal text-transform-none">Heading h1</h1>
<h2 class="fw-normal text-transform-none">Heading h2</h2>
<h3 class="fw-normal text-transform-none">Heading h3</h3>
<h4 class="fw-normal text-transform-none">Heading h4</h4>
<h5 class="fw-normal text-transform-none">Heading h5</h5>
<h6 class="fw-normal text-transform-none">Heading h6</h6>
H1 to H6 - Bootstrap typography

Heading h1

Heading h2

Heading h3

Heading h4

Heading h5
Heading h6
HTML Code:
<h1 class="fs-1 fw-bold text-uppercase">Heading h1</h1>
<h2 class="fs-2 fw-bold text-uppercase">Heading h2</h2>
<h3 class="fs-3 fw-bold text-uppercase">Heading h3</h3>
<h4 class="fs-4 fw-bold text-uppercase">Heading h4</h4>
<h5 class="fs-5 fw-bold text-uppercase">Heading h5</h5>
<h6 class="fs-6 fw-bold text-uppercase">Heading h6</h6>
H1 to H6 - Display headings

Heading h1

Heading h2

Heading h3

Heading h4

Heading h5
Heading h6
HTML Code:
<h1 class="display-1">Heading h1</h1>
<h2 class="display-2">Heading h2</h2>
<h3 class="display-3">Heading h3</h3>
<h4 class="display-4">Heading h4</h4>
<h5 class="display-5">Heading h5</h5>
<h6 class="display-6">Heading h6</h6>