Foundations
Typography
Heading, size, weight and helper classes from styles/typography.css. The default font is Geist, loaded from styles/fonts.
Headings
Heading H1
Heading H2
Heading H3
Heading H4
Heading H5
Heading H6
<h1 class="text-h1">Heading H1</h1>
<h2 class="text-h2">Heading H2</h2>
<!-- text-h3 ... text-h6 -->Text sizes
text-xs — extra small texttext-sm — small textdefault — body texttext-lg — large text
<span class="text-xs">Extra small</span>
<span class="text-sm">Small</span>
<span class="text-lg">Large</span>Font weights
font-thin font-extralight font-light font-regular font-medium font-semibold font-bold font-extrabold font-black
<span class="font-light">Light</span>
<span class="font-semibold">Semi-bold</span>
<span class="font-bold">Bold</span>Helpers
muted — secondary information
Inline inline-code inside text.
text-center
text-right
<p class="muted">Secondary information</p>
<code class="inline-code">inline-code</code>
<p class="text-center">Centered</p>