Mauvelous

HEX: #EF98AA | Modern Palette

On White
2.16:1
FAIL
On Black
9.74:1
PASS

Color Specifications

HEX
#EF98AA
RGB
239, 152, 170
HSL
347°, 73% ,76%
CMYK
0, 36, 29, 6

About Mauvelous

Mauvelous (#EF98AA) is a color with RGB(239, 152, 170) and HSL(347.6°, 73.1%, 76.7%). It is commonly associated with Playful, Romantic moods. In design, it fits Warm styles and is suitable for Text, Button, Accent. Its complementary color is #98EFDD, which creates strong contrast. Its triadic palette includes #AAEF98 and #98AAEF. The name comes from Mauve (English).

  • HEX: #EF98AA
  • RGB: 239, 152, 170
  • HSL: 347.6°, 73.1%, 76.7%
  • Mood: Playful, Romantic
  • Style: Warm
  • Use case: Text, Button, Accent
  • Complementary color: #98EFDD
  • Triadic colors: #AAEF98, #98AAEF
  • The name comes from Mauve (English).

Live Components

LIGHT
DARK
System Notification Box

Color Palettes

Mauvelous #EF98AA is used in Monochromatic, Neutral + Accent, Analogous, 3 + 1 + 1 palettes, giving designers ready-made combinations for backgrounds, surfaces, accents, and interface elements.

Monochromatic Five tones of the same hue — a reliable scale for backgrounds, surfaces, and text.
 
 
 
MAUVELOUS
 
Neutral + Accent Four near-neutral tones grounded by a saturated accent — clean and versatile for UI.
 
 
MAUVELOUS
 
 
Analogous Five hues drifting across a 60° arc — naturally harmonious and pleasing to the eye.
 
 
 
 
 
3 + 1 + 1 Three analogous base colors, one complementary accent, one dark anchor — bold yet balanced.
 
 
 
 
 

Color Harmonies

Mauvelous #EF98AA pairs with #98EFDD as its complementary color, and #AAEF98 and #98AAEF in triadic combinations. These harmony relationships help create balanced color combinations for UI, branding, and design work.

Complementary

The color directly opposite on the color wheel — creates maximum contrast and vibrance.

MAUVELOUS
Analogous

Colors adjacent on the wheel — naturally harmonious and pleasing to the eye.

MAUVELOUS
Triadic

Three colors equally spaced 120° apart — bold, balanced, and visually rich.

MAUVELOUS
Split-Complementary

Two colors flanking the complement — high contrast with less tension than full complementary.

MAUVELOUS
Tetradic (Square)

Four colors at 90° intervals — rich variety, best when one color dominates.

MAUVELOUS
Monochromatic

Shades and tints of the same hue — cohesive, elegant, and easy to work with.

MAUVELOUS

Shades & Tints

The shade and tint range for Mauvelous #EF98AA moves from dark #160307 tones through the base color to lighter #FCE9ED tones, making it useful for depth, hierarchy, and background variation.

MAUVELOUS

Color Characteristics

Mood
Playful Romantic
Style
Warm
Use case
Text Button Accent

Accessibility Simulation

Deuteranopia #B7B7A8
Protanopia #A5A5AA
Tritanopia #EE9A9A
Achromatopsia #B1B1B1

Frequently Asked Questions

Mauvelous (#EF98AA) is a color with RGB(239, 152, 170) and HSL(347.6°, 73.1%, 76.7%).

#EF98AA pairs strongly with #98EFDD as its complementary color. It can also be used with neutral tones for balanced UI and design layouts.

#EF98AA is suitable for Text, Button, Accent and works well with Warm styles.

#EF98AA is commonly associated with Playful, Romantic.

The name Mauvelous is linked to Mauve from English, meaning A pale purple color, named after the mallow flower..

Name, History & Etymology

Origin Word Mauve
Meaning A pale purple color, named after the mallow flower.
Language English
First Recorded Use Late 19th Century

History

The color mauve itself has a fascinating history, becoming incredibly popular after William Henry Perkin accidentally discovered the synthetic dye mauveine in 1856. This dye revolutionized fashion and made purple accessible. The word 'mauve' comes from the French word for mallow flower, which has a similar pale purple hue. 'Mauvelous' is a more recent, informal linguistic creation, playing on the sound and meaning of 'marvelous' to describe something exceptionally mauve or, by extension, something delightful and charming, often with a slightly old-fashioned or whimsical connotation due to the color's historical popularity.

First Recorded Use

The term 'mauvelous' is a portmanteau of 'mauve' and 'marvelous'. While 'mauve' as a color name gained prominence in the mid-19th century (specifically 1859 with the discovery of mauveine dye), the playful adjective 'mauvelous' likely emerged later as a whimsical descriptor, possibly in the late 19th or early 20th century, though precise first use is hard to pinpoint. It's an informal, often humorous, coinage.

Cultural Associations

Mauve was a highly fashionable color in the Victorian era, particularly after its synthetic production. It symbolized luxury and modernity at the time. The term 'mauvelous' carries a lighthearted, often nostalgic or campy tone. It's not a standard dictionary word but is widely understood as a playful compliment, often used in contexts related to fashion, aesthetics, or anything deemed charmingly purple-ish or delightful. It evokes a sense of whimsical appreciation.

Similar Named Colors
Vanilla Ice #F38FA9 ΔE 2.71
Pink Sherbet #F78FA7 ΔE 2.73
Salmon Pink #FF91A4 ΔE 3.63
Baker-Miller Pink #FF91AF ΔE 3.79

Code Snippets

/* Background */
.element {
    background-color: #EF98AA;
}

/* Text */
.element {
    color: #EF98AA;
}

/* Border */
.element {
    border: 1px solid #EF98AA;
}

/* Linear gradient to complementary */
.element {
    background: linear-gradient(
        to right,
        #EF98AA,
        #98EFDD
    );
}

/* Radial gradient */
.element {
    background: radial-gradient(
        circle,
        #EF98AA,
        #98EFDD
    );
}

// SCSS variable
$mauvelous: #EF98AA;

// With RGB channels (useful for rgba() usage)
$mauvelous-r: 239;
$mauvelous-g: 152;
$mauvelous-b: 170;

// Usage
.element {
    background-color: $mauvelous;
    color: rgba($mauvelous-r, $mauvelous-g, $mauvelous-b, 0.8);
}