More intentional typography.

You should be using the typographic scale for your font sizing. But even if you are, your typography can still be ad hoc if you’re using a small ratio and picking sizes.

Don’t start with the ratio. Start with the need:

Headings

How many heading levels will you use?

Fonts

title:
body:

…or write in a Google Font

Impact

title:
× body
body:

get the CSS

Preview

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Nisi lacus sed viverra tellus in hac. In arcu cursus euismod quis.

Massa vitae

Lobortis elementum nibh tellus molestie nunc non blandit massa enim. Morbi tincidunt augue interdum velit euismod in pellentesque massa placerat.

Morbi leo urna molestie at. Donec ultrices tincidunt arcu non sodales. Lacinia quis vel eros donec ac odio tempor. Phasellus vestibulum lorem sed risus ultricies tristique.

Vestibulum

Habitasse platea dictumst vestibulum rhoncus est pellentesque elit ullamcorper dignissim. Suscipit tellus mauris a diam maecenas sed. Odio euismod lacinia at quis risus.

Senectus et netus

Senectus et netus et malesuada fames ac turpis egestas maecenas. Amet est placerat in egestas erat imperdiet sed euismod nisi. Amet volutpat consequat mauris nunc. Sed libero enim sed faucibus turpis in eu mi.

Consequat interdum varius sit amet mattis. Dolor sed viverra ipsum nunc aliquet bibendum enim. Eget mi proin sed libero enim. Amet est placerat in egestas erat.

Pulvinar

Ut faucibus pulvinar elementum integer enim. Vitae aliquet nec ullamcorper sit amet risus nullam eget. Faucibus in ornare quam viverra. Rhoncus dolor purus non enim praesent elementum facilisis leo vel. Suscipit tellus mauris a diam maecenas.

Orci sagittis

Quam viverra orci sagittis eu. Bibendum enim facilisis gravida neque convallis a cras semper. Suspendisse interdum consectetur libero id faucibus.

Non quam lacus suspendisse faucibus interdum posuere.
see the PAGE

CSS

HTML

In the past, it was better to let Google host your fonts. These days, it’s better to self host. Why?

You’d think you could just download the CSS and fonts from Google and use them on your website. But you’d only get a part of what you need that way. Google sends different files to different browsers. Google recommends self hosting, but doesn't provide a font kit. Thankfully, we do.