Styleguide

Design System: Consistency, Clarity, and Simplicity

A reference for colors, typography, components, and layout rules to ensure a unified and accessible design across all pages and campaigns.

Color Style

Main Color

Nordic Blue

#0062FF

Secondary

#3B82F6

Text

#111827

Supporting Color

Surface

#FFFFFF

Neutral Border

#E5E7EB

Subtext

#6B7280

Success

#10B981

Warning

#F59E0B

Error

#EF4444

Typography Style

Poppins - Heading

Heading - 1

Poppins - Semi bold, Font Size - 56, Line-height - 72

Heading - 1

Poppins - Semi bold, Font Size - 48, Line-height - 64

Heading - 3

Poppins - Semi bold, Font Size - 40, Line-height - 56

Heading - 4

Poppins - Semi bold, Font Size - 32, Line-height - 44

Heading - 5

Poppins - Semi bold, Font Size - 24, Line-height - 36

Heading - 6

Poppins - Semi bold, Font Size - 20, Line-height - 32

Poppins- Paragraph

Paragraph - 1

Poppins - Medium, Font Size - 16, Line-height - 16

Paragraph - 1

Poppins - Regular, Font Size - 16, Line-height - 26

Paragraph - 2

Poppins - Medium, Font Size - 14, Line-height - 22

Paragraph - 2

Poppins - Regular, Font Size - 14, Line-height - 22

Paragraph - 3

Poppins - Medium, Font Size - 12, Line-height - 12

Paragraph - 3

Poppins - Regular, Font Size - 12, Line-height - 12

Components

Button - Small(40px)

Talk to Us Try for Free Talk to Us Talk to Us

Button - Small(40px)

Talk to Us Talk to Us Talk to Us Talk to Us

Text area - Input