Color SystemThe Flownova
color palette.
Our colors communicate energy, trust, and clarity. Every shade is purpose-built for accessibility and brand consistency.
Primary Palette
The two core colors that define the Flownova brand.
Teal
Primary accent, CTAs, interactive elements, links, and highlights.
HEX
RGB
HSL
Navy
Primary text, headings, dark backgrounds, and navigation.
HEX
RGB
HSL
Extended Palette
Tints and shades for depth, hierarchy, and dark UI surfaces.
Teal Light
Navy Light
Navy Mid
Navy Muted
Dark
Functional Colors
Surfaces, backgrounds, and borders for UI composition.
Surface
Light
Muted
Border
Border Light
Quick Reference
All color values at a glance — click any value to copy.
| Color | HEX | RGB | HSL |
|---|---|---|---|
| Teal | |||
| Navy | |||
| Teal Light | |||
| Navy Light | |||
| Navy Mid | |||
| Navy Muted | |||
| Dark | |||
| Surface | |||
| Light | |||
| Muted | |||
| Border | |||
| Border Light |
Contrast Checker
WCAG 2.1 contrast ratios for common color pairings.
Teal on Navy
Contrast Ratio8.7:1
AA Normal Pass AA Large Pass AAA Pass
Navy on White
Contrast Ratio17.1:1
AA Normal Pass AA Large Pass AAA Pass
Teal on White
Contrast Ratio2.0:1
AA Normal Fail AA Large Fail AAA Fail
White on Navy
Contrast Ratio17.1:1
AA Normal Pass AA Large Pass AAA Pass
Teal on Dark
Contrast Ratio9.9:1
AA Normal Pass AA Large Pass AAA Pass
Navy on Light
Contrast Ratio15.9:1
AA Normal Pass AA Large Pass AAA Pass