Spacing Scale
Consistent spacing based on millimeters, with px and rem equivalents. Toggle the unit display below.
0.5
0.5mm
1
1mm
1.5
1.5mm
2
2mm
2.5
2.5mm
3
3mm
3.5
3.5mm
4
4mm
5
5mm
6
6mm
10
10mm
14
14mm
18
18mm
22
22mm
Border Radius
sm
2px
md
3px
base
4px
lg
5px
xl
6px
2xl
8px
3xl
10px
full
50%
Gradients
cover
Cover page / hero gradient — purple to cyan
header
Page header gradient — horizontal purple to cyan
purpleDark
Purple depth gradient — dark to primary purple
cyanDark
Cyan depth gradient — dark to primary cyan
workshopCover
Workshop cover gradient — deep purple
Spacing Scale
Consistent spacing tokens in px and rem. Toggle the unit display below.
1
4px
2
8px
3
12px
4
16px
5
20px
6
24px
8
32px
10
40px
12
48px
16
64px
20
80px
24
96px
Border Radius
sm
4px
md
6px
base
8px
lg
12px
xl
16px
2xl
20px
3xl
24px
full
9999px
Gradients
header
Primary header gradient — cyan to blue
cover
Dark cover background gradient
text
Hero text gradient — white to cyan
border
Border gradient — cyan to blue