What are the hex codes in the Citrine & Blue Gray Muse palette?

The Citrine & Blue Gray Muse color palette consists of Space #2B1C3C, Dusk #6C4977, Citrine #DBD860, Blue Gray #3197BB.

How should I use the Citrine & Blue Gray Muse palette on a website?

Use Citrine #DBD860 as the background, Space #2B1C3C for text, Blue Gray #3197BB for buttons and links, and Dusk #6C4977 for accents. 3 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Space on Citrine at 10.5:1.

Which colors in Citrine & Blue Gray Muse have enough contrast for text?

The highest-contrast pair is #2B1C3C on #DBD860 with a ratio of 10.5:1, which passes WCAG AA for normal text.

#2B1C3CSpace

#6C4977Dusk

#DBD860Citrine

#3197BBBlue Gray

Citrine & Blue Gray Muse color palette

Dark Blue Yellow

Color codes click any value to copy

Name	HEX	RGB	HSL	OKLCH
Space	`#2B1C3C`	`rgb(43, 28, 60)`	`hsl(268, 36%, 17%)`	`oklch(26.2% 0.061 304)`
Dusk	`#6C4977`	`rgb(108, 73, 119)`	`hsl(286, 24%, 38%)`	`oklch(46.2% 0.084 318)`
Citrine	`#DBD860`	`rgb(219, 216, 96)`	`hsl(59, 63%, 62%)`	`oklch(86.1% 0.142 108)`
Blue Gray	`#3197BB`	`rgb(49, 151, 187)`	`hsl(196, 58%, 46%)`	`oklch(63.4% 0.105 226)`

Why it works and how to use it

Citrine & Blue Gray Muse is a complementary color palette tagged dark, blue, yellow. Space and Blue Gray sit nearly opposite on the color wheel, so the pairing has real energy; keep one as the accent. Neither washed out nor loud, it adapts to most contexts. Warm and cool hues are mixed, which adds depth.

With 4 chromatic colors, Blue Gray takes the lead while the rest support. Lightness runs from 17% to 62%. Well suited to websites, presentations and branding.

Background: Citrine (#DBD860) is the lightest color, so it belongs on large surfaces.
Text: Space (#2B1C3C) on #DBD860 gives 10.5:1, passing WCAG AAA.
Primary: Blue Gray (#3197BB) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
Accent: Dusk (#6C4977) for highlights, badges and hover states.

3 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Space on Citrine at 10.5:1.

Preview on a real UI see how the palette feels in context

BrandFeaturesPricingBlogGet started

Design faster with Citrine & Blue Gray Muse

A palette preview that turns four colors into a page, so you can judge hierarchy, contrast and mood before you commit.

Primary action Secondary

Card title

Roles are assigned by lightness.

Color blindness simulation

#2B1C3C

#6C4977

#DBD860

#3197BB

Color-blind check: all four colors stay distinguishable under protanopia, deuteranopia and tritanopia.

Palette card

Contrast check WCAG ratios between palette colors

Pair	Sample	Ratio	Level
`#2B1C3C` on `#DBD860`	Aa	10.5:1	AAA
`#6C4977` on `#DBD860`	Aa	4.9:1	AA
`#2B1C3C` on `#3197BB`	Aa	4.7:1	AA
`#DBD860` on `#3197BB`	Aa	2.23:1	Fail
`#6C4977` on `#3197BB`	Aa	2.2:1	Fail
`#2B1C3C` on `#6C4977`	Aa	2.14:1	Fail

Similar palettes 24 more in this mood