What are the hex codes in the Misty Sand & Dusty Blue palette?

The Misty Sand & Dusty Blue color palette consists of Dove Gray #58737F, Stone #9E8A87, Dusty Blue #8EAEC2, Sand #C6B48B.

How should I use the Misty Sand & Dusty Blue palette on a website?

Use Sand #C6B48B as the background, Dove Gray #58737F for text, Dusty Blue #8EAEC2 for buttons and links, and Stone #9E8A87 for accents. No pair inside the palette reaches 4.5:1, so add black or white for body text.

Which colors in Misty Sand & Dusty Blue have enough contrast for text?

The highest-contrast pair is #58737F on #C6B48B with a ratio of 2.47:1, which does not meet WCAG AA; add a darker or lighter neutral for body text.

#58737FDove Gray

#9E8A87Stone

#8EAEC2Dusty Blue

#C6B48BSand

Misty Sand & Dusty Blue color palette

Muted Vintage Gray Beige

Color codes click any value to copy

Name	HEX	RGB	HSL	OKLCH
Dove Gray	`#58737F`	`rgb(88, 115, 127)`	`hsl(198, 18%, 42%)`	`oklch(53.9% 0.037 227)`
Stone	`#9E8A87`	`rgb(158, 138, 135)`	`hsl(8, 11%, 57%)`	`oklch(65.1% 0.025 28)`
Dusty Blue	`#8EAEC2`	`rgb(142, 174, 194)`	`hsl(203, 30%, 66%)`	`oklch(73.4% 0.046 236)`
Sand	`#C6B48B`	`rgb(198, 180, 139)`	`hsl(42, 34%, 66%)`	`oklch(77.5% 0.059 87)`

Why it works and how to use it

Misty Sand & Dusty Blue is a complementary color palette tagged muted, vintage, gray. Dove Gray and Sand 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 3 chromatic colors, Dusty Blue takes the lead while the rest support. Lightness runs from 42% to 66%. Well suited to websites, presentations and branding.

Background: Sand (#C6B48B) is the lightest color, so it belongs on large surfaces.
Text: Dove Gray (#58737F) on #C6B48B gives 2.47:1, so pair it with a darker neutral for body copy.
Primary: Dusty Blue (#8EAEC2) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
Accent: Stone (#9E8A87) for highlights, badges and hover states.

No pair inside the palette reaches 4.5:1, so add black or white for body text.

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

BrandFeaturesPricingBlogGet started

Design faster with Misty Sand & Dusty Blue

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

#58737F

#9E8A87

#8EAEC2

#C6B48B

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
`#58737F` on `#C6B48B`	Aa	2.47:1	Fail
`#58737F` on `#8EAEC2`	Aa	2.15:1	Fail
`#9E8A87` on `#C6B48B`	Aa	1.6:1	Fail
`#58737F` on `#9E8A87`	Aa	1.54:1	Fail
`#9E8A87` on `#8EAEC2`	Aa	1.4:1	Fail
`#8EAEC2` on `#C6B48B`	Aa	1.15:1	Fail

Similar palettes 24 more in this mood