Design system
Style guide
Colour
Ground
var(--ground)
Surface
var(--surface)
Text
var(--text)
Text muted
var(--text-muted)
Line
var(--line)
Accent
var(--accent)
Accent soft
var(--accent-soft)
Olive
var(--olive)
Typography
H1 / Heading 1
Calm skin care
H2 / Heading 2
Calm skin care
H3 / Heading 3
Calm skin care
H4 / Heading 4
Calm skin care
Lead paragraph in DM Sans, set slightly larger for introductions.
Body text in DM Sans. Skin care that takes its time, with advice you can follow.
Small text for captions and meta.
Buttons and tags
Form fields
Radii and shapes
Card, 8
Pill
Arch