Style Guide
Unlock design brilliance with a roadmap to create visually stunning and cohesive experiences.
80px
40px
Inter
Headers
For ease of use and consistency, this component allows you to switch between heading levels.
Super Heading
Heading 1
Heading 2
Heading 3
Heading 4
Heading 5
Body
Our standard body text comes in at 16px. It has underline link styling and comes in a big and small variation.
Super Body
Body M
Body
Note
Colors
Our system consists of a few brand colors, a selection of complementary colors and a scale from shading.
Olyn Green
Dark
White
Light
Shading
Apart from solid colors, we use opacity for shading.
Dark
Mid Dark
Olyn Green
50%
25%
15%
Complementary colors
Use for alerts and system notifications.
Red
Green
Icons
We use the Google Material icon set for all our icons.