Navy & gold color palette

Gold on deep navy. Prestigious and classic, a dark theme that still feels formal.

Palettes › Dark

Best for: Finance, law, luxury services

Navy & gold on a real website

Colorit's example site restyled with this palette. Balanced keeps surfaces close to the background; Expressive tints cards and sections with the accent. Your own site looks different: capture it to see.

Example website restyled in Navy & gold, balanced
Balanced
Example website restyled in Navy & gold, expressive
Expressive

Readable by design

Colorit turns the five colors into a full theme and checks each text pair. Ratios of 4.5:1 and above meet WCAG AA for body text.

PairContrast
Text on background16.2:1
Muted text on background8.2:1
Button text on accent10.3:1
Text on cards12.0:1

Use the Navy & gold palette in code

The five colors as CSS variables and as a Tailwind v4 theme. For the full semantic theme (surfaces, borders, button states) as shadcn/ui, Tailwind or CSS, open it in the free theme generator. A prompt for your coding tool, made for your own captured site, comes with Colorit Pro.

CSS variables
:root {
  --color-1: #0e1626;
  --color-2: #18233a;
  --color-3: #eef3fb;
  --color-4: #f2b84b;
  --color-5: #a3b0c4;
}
Tailwind v4
@theme {
  --color-1: #0e1626;
  --color-2: #18233a;
  --color-3: #eef3fb;
  --color-4: #f2b84b;
  --color-5: #a3b0c4;
}

Similar dark palettes

All dark palettes · All 48 palettes