Examples

Typography

All of the fonts are set with the "rem" (root em) measurement. The default HTML font size is set to 62.5% meaning that 1rem = 10px, 55rem = 550px etc... As you can imagine this makes it much easier to set your sizes in your head and reduce brain strain. The default font size for the body text and lists et cetera is 1.6rem or 16px.

Heading One

Heading Two

Heading Three

Paragraph

Anchor Tag

Default Typography

<h1>Heading One</h1>
<h2>Heading Two</h2>
<h3>Heading Three</h3>
<p>Paragraph</p>
<a href="#">Anchor Tag</a>

Display Headings

If you would like your headings to stand out a little more then you can use a display heading.

Display Heading 1

Display Heading 2

Display Heading 3

Display Heading 4

Default Display Headings

<h2 class="display-1">Display Heading 1</h2>
<h2 class="display-2">Display Heading 2</h2>
<h2 class="display-3">Display Heading 3</h2>
<h2 class="display-4">Display Heading 4</h2>