Navy Charter
A complete five-role scheme. trustworthy and professional in character — tagged for finance, consulting, law.
#12355b #5b7fa6 #d9a441 #f7f9fc #101d2c Ship your next idea faster
Everything you need to launch, in one place.
Get started Learn moreOpen this scheme in the Studio →
Color values
| Role | Hex | RGB | HSL |
|---|---|---|---|
| primary | #12355b | 18, 53, 91 | 211°, 67%, 21% |
| secondary | #5b7fa6 | 91, 127, 166 | 211°, 30%, 50% |
| accent | #d9a441 | 217, 164, 65 | 39°, 67%, 55% |
| background | #f7f9fc | 247, 249, 252 | 216°, 45%, 98% |
| text | #101d2c | 16, 29, 44 | 212°, 47%, 12% |
Contrast (WCAG)
| Pair | Ratio | Level |
|---|---|---|
| text on background | 16.13 | AAA |
| primary on background | 11.81 | AAA |
| secondary on background | 3.96 | AA-large |
| accent on background | 2.13 | fail |
| background on primary | 11.81 | AAA |
| background on accent | 2.13 | fail |
CSS variables
:root {
--color-primary: #12355b;
--color-secondary: #5b7fa6;
--color-accent: #d9a441;
--color-bg: #f7f9fc;
--color-text: #101d2c;
}Tailwind
colors: {
primary: '#12355b',
secondary: '#5b7fa6',
accent: '#d9a441',
background: '#f7f9fc',
text: '#101d2c',
}Best text pairings
The strongest foreground/background combinations in Navy Charter, ranked by WCAG contrast. Darker color set as the text; ratios of 4.5:1+ suit body copy, 7:1+ meet AAA.
Aa Bb 09
Pack my box with five dozen liquor jugs.
This pair — text on background — clears AAA comfortably.
#101d2c on #f7f9fc Aa Bb 09
Pack my box with five dozen liquor jugs.
This pair — primary on background — clears AAA comfortably.
#12355b on #f7f9fc Aa Bb 09
Pack my box with five dozen liquor jugs.
This pair — text on accent — clears AAA comfortably.
#101d2c on #d9a441 Aa Bb 09
Pack my box with five dozen liquor jugs.
This pair — primary on accent — meets AA for body text.
#12355b on #d9a441