Typography
Headings
Heading h1
Heading h2
Heading h3
Heading h4
Heading h5
Heading h6
<div className="typography__items">
<h1>h1. Bootstrap heading</h1>
<h2>h2. Bootstrap heading</h2>
<h3>h3. Bootstrap heading</h3>
<h4>h4. Bootstrap heading</h4>
<h5>h5. Bootstrap heading</h5>
<h6>h6. Bootstrap heading</h6>
</div>
Display headings
Display 1
Display 2
Display 3
Display 4
<div className="typography__items">
<h1 className="d1">Display 1</h1>
<h2 className="d2">Display 2</h2>
<h3 className="d3">Display 3</h3>
<h4 className="d4">Display 4</h4>
</div>
Body Text
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin volutpat mollis egestas. Nam luctus facilisis ultrices. Pellentesque volutpat ligula est, id ullamcorper purus semper sed.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin volutpat mollis egestas. Nam luctus facilisis ultrices. Pellentesque volutpat ligula est, id ullamcorper purus semper sed.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin volutpat mollis egestas. Nam luctus facilisis ultrices. Pellentesque volutpat ligula est, id ullamcorper purus semper sed.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin volutpat mollis egestas. Nam luctus facilisis ultrices. Pellentesque volutpat ligula est, id ullamcorper purus semper sed.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin volutpat mollis egestas. Nam luctus facilisis ultrices. Pellentesque volutpat ligula est, id ullamcorper purus semper sed.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin volutpat mollis egestas. Nam luctus facilisis ultrices. Pellentesque volutpat ligula est, id ullamcorper purus semper sed.
<div className="body__text">
<div className="body__text__item">
<span className="texttitle">
Lead text
</span>
<p className="lead">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin volutpat mollis egestas. Nam luctus facilisis ultrices. Pellentesque volutpat ligula est, id ullamcorper purus semper sed.
</p>
</div>
<div className="body__text__item">
<span className="texttitle">
XL text
</span>
<p className="xl">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin volutpat mollis egestas. Nam luctus facilisis ultrices. Pellentesque volutpat ligula est, id ullamcorper purus semper sed.
</p>
</div>
<div className="body__text__item">
<span className="texttitle">
L text
</span>
<p className="lg">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin volutpat mollis egestas. Nam luctus facilisis ultrices. Pellentesque volutpat ligula est, id ullamcorper purus semper sed.
</p>
</div>
<div className="body__text__item">
<span className="texttitle">
Md text
</span>
<p className="md">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin volutpat mollis egestas. Nam luctus facilisis ultrices. Pellentesque volutpat ligula est, id ullamcorper purus semper sed.
</p>
</div>
<div className="body__text__item">
<span className="texttitle">
Sm text
</span>
<p className="sm">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin volutpat mollis egestas. Nam luctus facilisis ultrices. Pellentesque volutpat ligula est, id ullamcorper purus semper sed.
</p>
</div>
<div className="body__text__item">
<span className="texttitle">
Sm text
</span>
<p className="xs">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin volutpat mollis egestas. Nam luctus facilisis ultrices. Pellentesque volutpat ligula est, id ullamcorper purus semper sed.
</p>
</div>
</div>