Mauve pink is a soft, romantic hue that combines purple and pink. Nestled between pink and violet on the color wheel, it exudes elegance and warmth. This subtle pink pairs well with pastel shades and elegant tones, making it ideal for creating serene color palettes in your designs.
Mauve Pink is defined by the following color codes and values to ensure consistency across various digital platforms and devices.
- Hex Code: #E0B0FF
- RGB value: 87.8% red, 69.0% green, 100.0% 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
For variations within the same spectrum as mauve pink, consider:
- Lavender (#D3D3FF): This color shares Mauve Pink's soft, pastel-like quality, with a slightly cooler tone that complements violet hues beautifully.
- Orchid (#ED80E9): Orchid brings a vibrant touch similar to Mauve Pink. Both colors capture the elegance found in a purple-pink color spectrum, though Orchid leans slightly more into purple.
- Light Purple (#DAB1DA): Light Purple carries the same muted pink essence as Mauve Pink, providing a subtle, romantic hue that fits seamlessly into an elegant color palette.
- Lilac (#A47DAB): Lilac echoes the muted and charming nature of Mauve Pink, offering a cooler, more subdued pink that exudes a feminine and soft aesthetic.
To complement Mauve Pink, consider pairing it with:
- Seafoam (#8DDCDC): This minty green provides a refreshing contrast to Mauve Pink’s muted pink tones, creating a lively and balanced palette.
- Slate Blue (#557C99): Offering a sophisticated contrast, Slate Blue enhances the elegance of Mauve Pink, perfect for vintage design and romantic hues.
- Cream (#FDFBD4): Soft and neutral, Cream highlights Mauve Pink’s delicate nature, allowing its romantic hue to stand out in any color palette.
While Mauve Pink is a soft and soothing hue, it may clash with:
- Forest Green (#2e6f40): Forest Green’s deep earthiness contrasts sharply with Mauve Pink’s gentle nature, leading to a visual discord that disturbs the eye’s balance.
- Cobalt Blue (#0047ab): This vibrant shade of blue can overpower Mauve Pink’s subtle and muted tones, resulting in an imbalanced color combination.
- Neon Orange (#ff5c00): The intense brightness of Neon Orange can create a jarring effect against Mauve Pink’s soft elegance, making the colors compete rather than complement.
- Dark Purple (#341539): The richness of Dark Purple might overshadow Mauve Pink’s lighter, more delicate essence, causing a disproportionate visual weight.
- Lime Green (#89f336): The bright and bold Lime Green can clash with Mauve Pink’s muted appearance, forming a palette with competing intensities that lack harmony.
Color variations
Shades
Tints
Tones
Hues
Color harmonies
Complementary
Split
Monochromatic
Analogous
Triadic
Square
Custom palettes
Amethyst Petals
Lavender Mint
Dreamy Whisper
Contrast checker
Contrast 1.78
- Large Text
#E0B0FF
- Normal Text
How you design, align, and build matters. Do it together with Figma.
| Category | ||
|---|---|---|
Fail | Fail | |
Fail | Fail | |
Fail | Fail |
Contrast 11.82
- Large Text
#E0B0FF
- 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 #E0B0FF, known as Mauve Pink, has RGB values of R:224, G:176, B:255 and CMYK values of C:12, M:31, Y:0, K:0.
| VALUE | CSS | |
|---|---|---|
| HEX | #E0B0FF | #E0B0FF |
| RGB DECIMAL | 224, 176, 255 | RGB(224,176,255) |
| RGB PERCENTAGE | 87.8, 69.0, 100.0 | RGB(87.8%,69.0%,100.0%) |
| CMYK | 12, 31, 0, 0 | |
| HSL | HSL(276.5, 100.0%, 84.5%) | HSL(276.5, 100.0%, 84.5%) |
| HSV (OR HSB) | 276.5°, 31.0, 100.0 | |
| WEB SAFE | #204153255 | #204153255 |
| BINARY | 11100000, 10110000, 11111111 | |
| iOS - SwiftUI | Color(red: 0.878, green: 0.690, blue: 1.000) | |
| iOS - UIKit | UIColor(red: 0.878, green: 0.690, blue: 1.000, alpha: 1) | |
| Android - Compose | Color(0xFFE0B0FF) |
