Font Play
Experiment with different looks using these font-family 'short stacks'. Not recommended for production.
font-[stack] experimental
Athelas experience design made simple
for living design systems
font-athelas
Avenir experience design made simple
for living design systems
font-avenir
Baskerville experience design made simple
for living design systems
font-baskerville
Bodoni experience design made simple
for living design systems
font-bodoni
Calisto experience design made simple
for living design systems
font-calisto
Consolas experience design made simple
for living design systems
font-consolas
Courier experience design made simple
for living design systems
font-courier
Didot experience design made simple
for living design systems
font-didot
Garamond experience design made simple
for living design systems
font-garamond
Gotham experience design made simple
for living design systems
font-gotham
Goudy experience design made simple
for living design systems
font-goudy
Helvetica Thin experience design made simple
for living design systems
font-helvetica-thin
<h2 class="font-helvetica-thin">Experience design made simple <br>for living design systems</h2>
Create an HTML tag suitable for displaying text such as <p> or <h1>, and apply a font-[stack] class such as font-helvetica-thin. These fonts are defined in /evo_variables/_font.scss.