DESIGN SYSTEM

STYLE GUIDE

Discover the typography, colors, spacing, components, and utility classes that create a consistent and scalable design system throughout the template.

01. Colors02. Typography03. Buttons

Colors

Brand 300
#ceff23
Black
#000000
White
#ffffff

Typography

Default Headings

Heading 1

H1 - 80px / 1.1 || Extra Bold || Sora

Heading 2

H2 - 48px / 1.1 || Extra Bold || Sora

Heading 3

H3 - 36px / 1.1 || Extra Bold || Sora

Heading 4

H4 - 30px / 1.1 || Extra Bold || Sora
Heading 5
H5 - 26px / 1.1 || Extra Bold || Sora
Heading 6
H6 - 24px / 1.1 || Extra Bold || Sora

Text Styles

Body
Body - 16px / 1.5 || Regular || Inter

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

Body - 18px / 1.5 || Regular || Inter