(Template) Style guide

Style guide

Style guide

Every colour, text style and component in one place. Change a style here and it updates across the whole site.

Colours

Colours

Paper

#F5F4EF

Surface

#ECEAE3

Card

#FFFFFF

Ink

#0F0F0D

Muted

#6E6C65

Line

10% Ink

Accent

#3B5BFF

Accent Soft

#DFE5FF

Typography — Satoshi

Typography — Satoshi

Display — 104/72/48

Design that people remember

Heading 2 — 64/48/36

Design that people remember

Heading 3 — 28/24

Design that people remember

Body Large — 20/18

Design that people remember

Body — 16

Design that people remember

Label — 13 uppercase

Design that people remember

Heading 4 — 22

Heading 4 — 22

Design that people remember

Heading 5 — 18

Heading 5 — 18

Design that people remember

UI — 15 medium

UI — 15 medium

Design that people remember

Small — 14

Small — 14

Design that people remember

Small Strong — 14 medium

Small Strong — 14 medium

Design that people remember

Caption — 12

Caption — 12

Design that people remember

Caption Strong — 12 medium

Caption Strong — 12 medium

Design that people remember

Overline — 11 uppercase

Overline — 11 uppercase

Design that people remember

Components

Components

+

Projects shipped

Brand identity

How long does a typical project take?

Most brand and website projects run 6–10 weeks, from kickoff workshop to launch. We share a clear timeline in week one.

Create a free website with Framer, the website builder loved by startups, designers and agencies.