Josefin Sans

sans-serif 14 Styles Variable Font
Hero Layout

Type with Purpose

Good typography guides attention, improves understanding, and makes communication effortless.

Get Started Learn More
Article Preview

The Anatomy of a Typeface

By FontSide · September 2026

Every typeface is a system of decisions — about stroke contrast, x-height, spacing, and rhythm. The best ones feel invisible: you stop seeing the letters and start hearing the voice behind them. That transparency is the hardest thing to design.

A high x-height opens up the counters and makes small text breathe. Tight tracking pulls a headline together; loose tracking gives a caption room to exhale. None of these choices are accidents — they are arguments about how reading should feel.

Specimen Scale
Preview Text
Weights
72px
The quick brown fox jumps over the lazy dog
48px
The quick brown fox jumps over the lazy dog
36px
The quick brown fox jumps over the lazy dog
24px
The quick brown fox jumps over the lazy dog
18px
The quick brown fox jumps over the lazy dog
14px
The quick brown fox jumps over the lazy dog
Character Map

Uppercase

A
B
C
D
E
F
G
H
I
J
K
L
M
N
O
P
Q
R
S
T
U
V
W
X
Y
Z

Lowercase

a
b
c
d
e
f
g
h
i
j
k
l
m
n
o
p
q
r
s
t
u
v
w
x
y
z

Numerals

0
1
2
3
4
5
6
7
8
9

Symbols

!
?
.
,
;
:
—
…
“
”
‘
’
(
)
[
]
{
}
/
\
@
#
$
%
&
*
+
−
=

Install

pnpm add @fontsource-variable/josefin-sans
79K / Month

Designed by

Santiago Orozco

Links

Fontsource Google Fonts

License

OFL-1.1