Kraken uses relative sizing (ems
and %
, not px
) for everything.
The body
has a base font-size
of 106.25%
, which is 17px
on browsers with default font settings. All other sizes are in ems. Changing the font-size
on the body
element will adjust the typographical scale for the entire site.
(New to relative sizing? Learn more.)
The font-family
on the body
is "Helvetica Neue", Arial, sans-serif
. This sets the typeface for the entire site. Adjust as needed.
The typographic scale was built using Iain Lamb's Typograph app.
Default text.
Muted text.
Small text.
Tall text.
Hyperlinks.
Bold and italics.
Note: Because Kraken uses relative sizing, you should always apply .text-tall
and .text-small
classes to a <span>
element and not directly to a <p>
. Otherwise, your spacing will get all messed up.