Styleguide

Clinique Auto

Category: car-body-shop-or-repair-shop. Tokens derived from brand/design-tokens.json. Edit the JSON, re-render, refresh.

Palette

primary
#d93a26
primary-ink
#ffffff
accent
#847b5a
bg
#f6f5f1
surface
#ffffff
ink
#1e2024
muted
#5c5e63
line
#e2e0d8
success
#3e7a44
warn
#b07a1a
danger
#9b3a2e
primary-glow
#ff6a4d
accent-soft
#e9e6da
bg-dark
#1c1e22
surface-dark
#2a2d33
ink-inverse
#f6f5f1
muted-inverse
#a8aaad
line-dark
#3b3f47

Typography

display
The quick brown fox
h1
Welcomed into a calm room
h2
Treatments & pricing
h3
What to expect
body
Body copy at the default reading size, with a generous line-height. This is the size most visitors will read.
small
Captions, footnotes, microcopy.

Spacing

--s-1
4px
--s-2
8px
--s-3
12px
--s-4
16px
--s-5
24px
--s-6
32px
--s-7
48px
--s-8
64px
--s-9
96px
--s-10
128px

Shape

sm
md
lg
pill

Buttons

Book a Session Learn more Cancel

Cards

Reflexology

60 min standard session. CHF 120.

Book

Maternity

Adapted for pregnancy. CHF 130.

Book

Hand reflex

30 min option for clients with foot sensitivity.

Book

Hero (example layout)

Reflexology in your town
A calm hour for your body to settle.

One-line supporting copy that reassures the visitor, names the practitioner, and points at the booking link.

Book a SessionWhat to expect