Brand
The marks, the palette and the rules
Everything here is read from the design tokens the product ships with, so it cannot go out of date. Use it for a deck, an integration listing or a press piece.
Two marks
The lockup wherever there is room for it. The glyph alone when there is not: an avatar, a favicon, a tab. Never both in one place.
Clear space
Leave the height of the glyph on every side. It is a generous amount on purpose: the mark is small and quiet, and crowding is the one thing that makes it look cheap.
What not to do to it
- Recolour the mark, including to match a layout or a dark background.
- Redraw, stretch, rotate, outline or add an effect to it.
- Set it on ink, on a photograph, or on any colour but white or stone.
- Crowd it. Nothing sits inside its clear space, including a rule.
- Rebuild the wordmark in another typeface, or letterspace it.
The green is the one colour in the system and it belongs to the mark. It is never a background, a fill, a border, a badge or a word of text.
Colour
Brand green
#0E5747
The mark, and nothing else
Ink
#16130F
All primary text
Stone
#F7F5F1
The glyph, and a quiet band
Canvas
#FFFFFF
Page background
Muted
#6A645C
The one soft text tone
Hairline
#DCD7CF
Borders and rules
Type
Hanken Grotesk carries everything, at weights 400, 500 and 600. There is no bold anywhere in the system, and display sits at 400.
- Display3.75rem
- Charlie is cool
- Heading2.375rem
- Charlie is cool
- Subheading1.625rem
- Charlie is cool
- Body1rem
- Charlie is cool