Intro

This guide serves as a comprehensive manual for the visual and technical elements that give our websites their distinctive look and feel.

This Styleguide has two purposes: to give you instant visual feedback when you customize the global assets of this website, and to be used as a reference tool by designers, developers, and content creators. It ensures that no matter who works on the project, or when they work on it, our brand's integrity and cohesiveness are preserved.

Color

Adjust and apply your brand's color palette using the guidelines here, setting the tone and identity of your website's visual theme.

Primary 50

#F0FEFA

Primary 100

#CEFDED

Accent 400

#213452

Accent 50

#213452

Accent 100

#213452

Accent 800

#213452

White

#FFFFFF

Black

#131313

Greyscale

Gray 50

#FAFAFA

Gray 100

#F5F5F5

Gray 200

#EEEEEE

Gray 300

#E0E0E0

Gray 500

#9E9E9E

Gray 700

#616161

Gray 900

#212121

Typography

Customize your site's typography according to these standards to match your brand's voice, ensuring readability and brand recognition.

Heading 1

Sora, 60 px, Bold

Heading 2

Sora, 40 px, Semibold

Heading 3

Sora, 30 px, Medium

Heading 4

Sora, 20 px, Medium

Heading 5

Sora, 20 px, Medium

Heading 6

Sora, 16 px, Medium

Body

Sora, 16 px, Regular

Body Small

Sora, 14 px, Light

Buttons

Use this section to tailor button styles to fit your brand's aesthetic, while keeping the user experience intuitive and familiar.

Default

Secondary

Dark background

Ghost

With Icon