<UI System />

Built with
Edit page

Typography

Font Family
f
o
n
t
-
{
f
a
m
i
l
y
}

The quick brown fox jumps over the lazy dog
font-sans
system-uiBlinkMacSystemFont-apple-systemSegoe UIRobotoOxygenUbuntuCantarellFira SansDroid SansHelvetica Neuesans-serif
The quick brown fox jumps over the lazy dog
font-serif
ConstantiaLucida BrightLucidabrightLucida SerifLucidaDejaVu SerifBitstream Vera SerifLiberation SerifGeorgiaserif
The quick brown fox jumps over the lazy dog
font-mono
MenloMonacoConsolasLiberation MonoCourier Newmonospace

Line Height
l
e
a
d
i
n
g
-
{
s
i
z
e
}

Portland flannel trust fund plaid kitsch. Hot chicken everyday carry williamsburg YOLO green juice lomo. Bicycle rights man bun +1 shabby chic migas salvia listicle polaroid paleo.
leading-none
1
Portland flannel trust fund plaid kitsch. Hot chicken everyday carry williamsburg YOLO green juice lomo. Bicycle rights man bun +1 shabby chic migas salvia listicle polaroid paleo.
leading-tight
1.25
Portland flannel trust fund plaid kitsch. Hot chicken everyday carry williamsburg YOLO green juice lomo. Bicycle rights man bun +1 shabby chic migas salvia listicle polaroid paleo.
leading-snug
1.375
Portland flannel trust fund plaid kitsch. Hot chicken everyday carry williamsburg YOLO green juice lomo. Bicycle rights man bun +1 shabby chic migas salvia listicle polaroid paleo.
leading-normal
1.5
Portland flannel trust fund plaid kitsch. Hot chicken everyday carry williamsburg YOLO green juice lomo. Bicycle rights man bun +1 shabby chic migas salvia listicle polaroid paleo.
leading-relaxed
1.625
Portland flannel trust fund plaid kitsch. Hot chicken everyday carry williamsburg YOLO green juice lomo. Bicycle rights man bun +1 shabby chic migas salvia listicle polaroid paleo.
leading-loose
2

Letter Spacing
t
r
a
c
k
i
n
g
-
{
s
i
z
e
}

The face of the moon was in shadow.
tracking-tighter
-.05em
The face of the moon was in shadow.
tracking-tight
-.025em
The face of the moon was in shadow.
tracking-normal
0
The face of the moon was in shadow.
tracking-wide
.025em
The face of the moon was in shadow.
tracking-wider
.05em
The face of the moon was in shadow.
tracking-widest
.1em

Font Sizes
t
e
x
t
-
{
s
i
z
e
}

.512rem
Aa
text-tiny
.64rem
Aa
text-xs
.8rem
Aa
text-sm
1rem
Aa
text-base
1.25rem
Aa
text-lg
1.5625rem
Aa
text-xl
1.953125rem
Aa
text-2xl
2.44140625rem
Aa
text-3xl
3.051757812rem
Aa
text-4xl