Brand Guidelines
A unified design system built for performance, clarity, and visual excellence. Featuring Inter for clarity and Manrope for character.
Typography
The voice of our brand. Inter for functional body text and Manrope for bold, expressive headings.
Headings - Manrope (Extra Bold 800)
Heading 1
Heading 2
Heading 3
Heading 4
Heading 5
Heading 6
Font Scale - Inter
The quick brown fox jumps over the lazy dog
The quick brown fox jumps over the lazy dog
The quick brown fox jumps over the lazy dog
The quick brown fox jumps over the lazy dog
The quick brown fox jumps over the lazy dog
The quick brown fox jumps over the lazy dog
The quick brown fox jumps over the lazy dog
The quick brown fox jumps over the lazy dog
The quick brown fox jumps over the lazy dog
The quick brown fox jumps over the lazy dog
Color Palette
Our primary brand color is Green Haze, representing growth, vitality, and precision.
Green Haze
50
#EFFEF5
100
#D9FFEB
200
#B5FDD8
300
#7BFABB
400
#3BED96
500
#11D676
600
#07B25F
700
#0B9A55
800
#0E6D40
900
#0D5A37
950
#01321C
Green Haze Transparency Palette
Shades of our primary green (#0b9a55) with alpha opacity. Used for overlays, glass card styles, and scrolled header states.
5%
rgba(11, 154, 85, 0.05)
10%
rgba(11, 154, 85, 0.1)
15%
rgba(11, 154, 85, 0.15)
20%
rgba(11, 154, 85, 0.2)
30%
rgba(11, 154, 85, 0.3)
40%
rgba(11, 154, 85, 0.4)
50%
rgba(11, 154, 85, 0.5)
80%
rgba(11, 154, 85, 0.8)
Primary Action
Used for main buttons and key highlights.
Deep Green
Used for dark backgrounds and containers.
Components
Reusable UI patterns that maintain consistency across the entire application.
Surfaces
Default Glass Card
Optimized for grids and content cards, supports background gradients and images.
CTA Glass Card
Frosty, high-transparency overlay optimized for dark, graphic, or video backgrounds.
Standard Container
Clean, modern containers with generous padding and subtle borders.
Visual Style
Examples of how colors and typography come together.
Vibrant
Dynamic
Premium