Blush

HEX: #DE5D83 | Modern Palette

On White
3.50:1
FAIL
On Black
6.00:1
PASS

Color Specifications

HEX
#DE5D83
RGB
222, 93, 131
HSL
342°, 66% ,61%
CMYK
0, 58, 41, 13

About Blush

Blush (#DE5D83) is a color with RGB(222, 93, 131) and HSL(342.3°, 66.2%, 61.8%). 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 #5DDEB8, which creates strong contrast. Its triadic palette includes #83DE5D and #5D83DE. The name comes from Blush (English).

  • HEX: #DE5D83
  • RGB: 222, 93, 131
  • HSL: 342.3°, 66.2%, 61.8%
  • Mood: Playful, Romantic
  • Style: Warm
  • Use case: Text, Button, Accent
  • Complementary color: #5DDEB8
  • Triadic colors: #83DE5D, #5D83DE
  • The name comes from Blush (English).

Live Components

LIGHT
DARK
System Notification Box

Color Palettes

Monochromatic Five tones of the same hue — a reliable scale for backgrounds, surfaces, and text.
Neutral + Accent Four near-neutral tones grounded by a saturated accent — clean and versatile for UI.
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

Complementary

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

Analogous

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

Triadic

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

Split-Complementary

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

Tetradic (Square)

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

Monochromatic

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

Shades & Tints

A seamless scale of #DE5D83 from deepest shade to lightest tint.

Color Characteristics

Mood
Playful Romantic
Style
Warm
Use case
Text Button Accent

Accessibility Simulation

Deuteranopia #93937F
Protanopia #757584
Tritanopia #DC6363
Achromatopsia #898989

Frequently Asked Questions

Blush (#DE5D83) is a color with RGB(222, 93, 131) and HSL(342.3°, 66.2%, 61.8%).

#DE5D83 pairs strongly with #5DDEB8 as its complementary color. It can also be used with neutral tones for balanced UI and design layouts.

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

#DE5D83 is commonly associated with Playful, Romantic.

The name Blush is linked to Blush from English, meaning To redden in the face, especially from modesty, shame, or confusion..

Name, History & Etymology

Origin Word Blush
Meaning To redden in the face, especially from modesty, shame, or confusion.
Language English
First Recorded Use Late Middle English

History

The word 'blush' comes from the Middle English 'blushen', which meant 'to shine, to glow, to look, to gaze'. It is thought to be related to the Old English 'blyscan' (to glow, to shine) and the Old Norse 'blygðast' (to blush, to be ashamed). The sense of reddening in the face due to emotion developed over time, becoming the primary meaning by the 16th century. The color 'Blush' (#de5d83) itself is a soft, pale pink, often associated with the natural flush of human skin.

First Recorded Use

c. 1300-1400

Cultural Associations

Blushing is a universal physiological response often associated with shyness, embarrassment, modesty, or even excitement. In many cultures, a blush can be seen as a sign of innocence or sincerity. In literature and art, blushing is frequently used to convey character emotions, particularly in romantic contexts. The color 'Blush' is widely used in fashion, cosmetics (e.g., blush makeup), and interior design to evoke feelings of softness, femininity, and warmth.

Similar Named Colors
Dark Pink #E75480 ΔE 1.93
Fandango Pink #DE5285 ΔE 2.84
French Rose #F64A8A ΔE 4.43
Pale Red Violet #DB7093 ΔE 4.54

Code Snippets

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

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

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

/* Linear gradient to complementary */
.element {
    background: linear-gradient(
        to right,
        #DE5D83,
        #5DDEB8
    );
}

/* Radial gradient */
.element {
    background: radial-gradient(
        circle,
        #DE5D83,
        #5DDEB8
    );
}

// SCSS variable
$blush: #DE5D83;

// With RGB channels (useful for rgba() usage)
$blush-r: 222;
$blush-g: 93;
$blush-b: 131;

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