HueWiz / Color names / Dusty Rose
#C9A9A6

Dusty Rose color code

Dusty Rose hex code: #C9A9A6 · RGB 201, 169, 166. Also called dusty pink, muted rose.

Build a website palette from dusty rose →

What color is dusty rose?

Dusty rose is a muted, grayed pink, the color of dried roses. There's no standard value; versions range from a pale grayed pink (#C9A9A6, widely used) to a deeper rose (#B56576). What they share is low saturation, which makes dusty rose feel soft, vintage and grown-up rather than girly.

Dusty rose is a wedding and bridal favorite, and common in beauty, fashion, lifestyle blogs, interiors and boutique branding. It works well as a background tint or card color on websites.

Use deep text on pale dusty rose (dark plum or charcoal rather than pure black feels softer). For a filled button with white text, deepen the darkest dusty rose to about #AB5C6D; #B56576 itself only passes for large text. Pair it with sage green, navy, cream or gold for classic combinations.

Dusty Rose variants

Popular color names rarely have one official value. "Reference" values are the ones commonly listed in general color references; "HueWiz pick" values are lighter, deeper or muted versions chosen for interface work. Click a code to copy it.

Soft dusty rose (common value)#C9A9A6rgb(201, 169, 166) · HueWiz pick
Warm dusty rose#DCAE96rgb(220, 174, 150) · HueWiz pick
Deep dusty rose#B56576rgb(181, 101, 118) · HueWiz pick
Dusty rose tint#E6D2CFrgb(230, 210, 207) · HueWiz pick

Dusty Rose on a real website

The same base color in a light and a dark theme. Surfaces and text are tinted with dusty rose's hue; links are adjusted until they reach 4.5:1 against the surface. The accent comes from the first palette below.

light theme
StudioWorkAboutContact

Spring collection

Designed around dusty rose.

A short paragraph shows how body text reads on this surface, with an inline link in the brand color.

Get startedLearn more
NewCard on surface with an accent badge.
Light roles · surface #FBF5F4 · text #251D1C · link #876A67
dark theme
StudioWorkAboutContact

Spring collection

Designed around dusty rose.

A short paragraph shows how body text reads on this surface, with an inline link in the brand color.

Get startedLearn more
NewCard on surface with an accent badge.
Dark roles · surface #191211 · text #F1EDED · link #C9A9A6

Dusty Rose color palettes

Hand-picked combinations that work with dusty rose. Hover a swatch to see its code; click to copy.

Rose & navy

Open the first color in the palette studio →

Vintage wedding

Open the first color in the palette studio →

Boutique

Open the first color in the palette studio →

Dusty Rose contrast & accessibility

WCAG 2.x asks for 4.5:1 for normal text (AA), 3:1 for large text and 7:1 for AAA. Ratios are truncated, not rounded, so a pass shown here is a real pass. Check your exact pairs in the contrast checker.

PairingRatioNormal textLarge text
White text on dusty rose2.16:1FailFail
Black text on dusty rose9.70:1AAAAAA
Dusty Rose text on white2.16:1FailFail
Dusty Rose text on near-black #1111118.73:1AAAAAA
White text on deeper dusty rose #8A6D6A4.69:1AAAAA

Dusty Rose shades for Tailwind & design systems

An 11-step 50–950 ramp generated in OKLCH from #C9A9A6. Light steps suit backgrounds and borders, middle steps buttons, dark steps text. This is a generated ramp, not an official Tailwind palette.

Tailwind CSS v4

@import "tailwindcss";

@theme {
  --color-dusty-rose-50: #FFF4F3;
  --color-dusty-rose-100: #FFE6E4;
  --color-dusty-rose-200: #EFD3D0;
  --color-dusty-rose-300: #D9BAB7;
  --color-dusty-rose-400: #BC9E9B;
  --color-dusty-rose-500: #9D8481;
  --color-dusty-rose-600: #806A68;
  --color-dusty-rose-700: #665553;
  --color-dusty-rose-800: #4E403E;
  --color-dusty-rose-900: #372C2B;
  --color-dusty-rose-950: #211A19;
  --color-dusty-rose: #C9A9A6;
}

CSS variables

:root {
  --dusty-rose: #C9A9A6;
  --dusty-rose-rgb: 201 169 166;
  --dusty-rose-light: #FFE6E4;
  --dusty-rose-dark: #4E403E;
}

.btn-dusty-rose {
  background: #8A6D6A;
  color: #FFFFFF;
}

Need semantic roles (surface, text, primary, accent) and exports? Open dusty rose in the Tailwind color generator.

Dusty Rose FAQ

What is the hex code for dusty rose?

#C9A9A6 is the value HueWiz uses for dusty rose; it equals rgb(201, 169, 166). Other common versions include #DCAE96 (warm dusty rose), #B56576 (deep dusty rose), #E6D2CF (dusty rose tint).

Is dusty rose a warm or cool color?

With an HSL hue of 5° and 24% saturation, dusty rose reads as a warm red.

What text color looks best on dusty rose?

Use dark text. White on #C9A9A6 measures 2.16:1 and black measures 9.70:1; WCAG AA needs 4.5:1 for normal text. For white text, deepen it to about #8A6D6A.

What colors go with dusty rose?

Try rose & navy (#C9A9A6, #1D3557, #F8F3F0); vintage wedding (#E6D2CF, #C9A9A6, #9CAF88); boutique (#B56576, #E6D2CF, #FFFFFF). Each palette above can be copied or opened in the HueWiz studio.

Closest CSS named colors

Dusty Rose isn't a CSS keyword. These built-in CSS colors are the nearest by perceptual (OKLab) distance; lower ΔE means closer.

Related color names

Copied