Dusty rose is a gentle, muted shade that blends pink with hints of gray for a sophisticated and understated quality. It sits on the color wheel's cooler end of the pink spectrum, radiating a sense of elegance and romance with a touch of tranquility.
Dusty rose is defined by the following color codes and values to ensure consistency across various digital platforms and devices.
- HEX code: #DCA1A1
- RGB value: 86% red, 63% green, and 63% blue
Accessibility considerations play a crucial role in UX and UI design color choices. Figma offers plugins in the Community to make sure your designs meet Web Content Accessibility Guidelines.
Here are some ways to use dusty rose in your designs:
- Evoke calmness. Dusty rose’s soothing and balanced tones make it ideal for meditation or mindfulness apps.
- Accent color. Apply dusty rose to highlight key UI elements, like buttons, icons, or tabs, for a gentle yet distinct contrast.
- Highlights typography. Integrate dusty rose into headings, subheadings, or emphasized text to draw attention without creating visual noise—perfect for content-heavy UIs.
Keep in mind that color and its meaning can change from culture to culture—and at any given time. If you are designing for a global audience, research color considerations for your specific regions.
For variations within the same muted spectrum as dusty rose, consider:
- Rose gold (#DEA193) is a warm and metallic shade, offering subtle luxury while keeping the soft pink undertones.
- Nude (#F9E2C4) is a light yet warm color that provides a touch of softness.
- Rosewater (#FFD6D1) is a lighter, delicate pink with a gentle, airy feel.
To complement dusty rose, consider pairing it with:
- Navy blue (#000080) creates a dramatic contrast, grounding dusty rose’s soft elegance .
- Green sage (#98A869) complements dusty rose’s muted tones, creating a a serene and balanced palette.
- Blush pink (#FFE1DC) adds sweetness for a romantic and airy aesthetic.
Dusty rose also pairs well with soft grays and muted greens, providing a subtle contrast that enhances its gentle warmth.
While dusty rose is adaptable, it may clash with:
- Neon green (#2CFF05) creates a jarring contrast with dusty rose’s muted elegance.
- Hot pink (#FF69B4) is too close in hue to dusty rose, leading to a visually chaotic combination.
- Yellow (#FFFF00) is a bright and attention-grabbing color that can overpower dusty rose.
- Purple (#9D00FF) has cool, dark tones that clash with the soft warmth of dusty rose.
Dusty rose symbolizes elegance, nostalgia, and romance. It combines pink’s gentleness with gray’s maturity for a nuanced, soothing effect.
In color psychology, dusty rose evokes feelings of peace and security. Its muted tones temper emotions, promoting balance.
In UI design, dusty rose creates calming and inviting experiences. It works well for backgrounds in applications that aim for a soft and soothing feel. As an accent, it draws attention to less critical elements and softens bolder colors, enhancing readability.
Dusty rose has been popular in textiles and artwork since the Renaissance, valued for its subtle tones and its ability to warm flesh tones in paintings. It later became fashionable in clothing and decor, especially among the wealthy, during Great Britain’s 19th-century Regency era.
Today, dusty rose is widely used in fashion, interior design, and user interfaces for its soft, calming appeal.
Color variations
Shades
Tints
Tones
Hues
Color Harmonies
Complementary
Split
Monochromatic
Analogous
Triadic
Square
Custom Palettes
Pressed Flowers
Peonies
Vintage Floral
Contrast 2.17
- Large Text
#DCA1A1
- Normal Text
How you design, align, and build matters. Do it together with Figma.
| Category | ||
|---|---|---|
Fail | Fail | |
Fail | Fail | |
Fail | Fail |
Contrast 9.66
- Large Text
#DCA1A1
- Normal Text
How you design, align, and build matters. Do it together with Figma.
| Category | ||
|---|---|---|
Pass | Pass | |
Pass | Pass | |
Pass | Pass |
Color simulations
Protanopia
Deuteranopia
Tritanopia
Achromatopsia
The hexadecimal color #DCA1A1, known as dusty rose, has RGB values of R:220 G:161, B:161 and CMYK values of C:0, M:27, Y:27, K:14.
| VALUE | CSS | |
|---|---|---|
| HEX | DCA1A1 | #DCA1A1 |
| RGB DECIMAL | 220, 161, 161 | RGB(220,161,161) |
| RGB PERCENTAGE | 86.3, 63.1, 63.1 | RGB(86.3%,63.1%,63.1%) |
| CMYK | 0, 27, 27, 14 | |
| HSL | 0°, 45.7, 74.7 | HSL(0,45.7%,74.7%) |
| HSV (OR HSB) | 0°, 26.8, 86.3 | |
| WEB SAFE | CC9999 | #CC9999 |
| CIE-LAB | 71.745, 21.867, 8.638 | |
| XYZ | 48.693, 43.281, 39.505 | |
| xyY | 0.37, 0.329, 43.281 | |
| CIE-LCH | 71.745, 23.512, 21.554 | |
| CIE-LUV | 71.745, 37.986, 8.188 | |
| HUNTER-LAB | 65.788, 16.987, 10.448 | |
| BINARY | 11011100, 10100001, 10100001 | |
| iOS - SwiftUI | Color(red: 0.86, green: 0.63, blue: 0.63) | |
| iOS - UIKit | UIColor(red: 0.863, green: 0.631, blue: 0.631, alpha: 1) | |
| Android - Compose | Color(0xFFC0CEC7) |
