Skip to main content

Blush Red

#DE5D83·red family·WCAG AA

Tints & Shades

50

100

200

300

400

500

600

700

800

900

Scale from white (50) through Blush Red (500) to black (900), interpolated in Lab color space.

Color Values

HEX
#DE5D83
RGB
rgb(222, 93, 131)
HSL
hsl(342, 66%, 62%)
OKLCH
oklch(0.651 0.164 4)
CMYK
cmyk(0%, 58%, 41%, 13%)
Luminance:0.2500
CSS var:--color-blush-red
Tailwind:bg-[#DE5D83]

Accessibility

Score: 39/100

On White (#FFF)

3.5:1

AA Large

On Black (#000)

6:1

AA

On Light Gray (#F5F5F5)

3.21:1

AA Large

Best text color on this background:

black — 6.00:1
Open in Contrast Checker →

Design Applications

Background

background-color: #DE5D83

Text Color

color: #DE5D83

bg-[#DE5D83] text-[#000000]

Accent border card component

border-left: 4px solid #DE5D83

Color Harmonies

Complementary

Hooker's Green

#49796B

Triadic

Kelly Green

#4CBB17

Klein Blue

#002FA7

Split-Complementary

Smoke

#738276

Dark Teal

#003E4E

Analogous

Byzantium

#702963

Dahlia

#B80064

Venetian Red

#C80815

Burnt Sienna

#E97451

Similar Colors

Blush Pink

#DE5D83

Dark Pink

#E75480

Taffy Pink

#EF4778

French Rose

#F64A8A

Pale Violet Red

#DB7093

Strawberry

#FC5A8D

Color Meaning & Psychology

Red is the most emotionally intense color in the spectrum. It stimulates the nervous system, accelerates respiration, and increases heart rate. Red commands attention through associations with blood, fire, danger, and passion — making it the dominant choice for warnings, calls-to-action, and brand identities that must stand out instantly. In food culture, red stimulates appetite. In romance, it signals desire. In sport, studies show red-clad competitors win more often. However, overuse creates aggression. The most effective red designs use it sparingly as a focal accent. At medium lightness, it is the most versatile tone of this hue family — readable as text on light backgrounds, yet vibrant enough as a visual accent.

Industry Usage

Common contexts and industries where Blush Red is applied in professional design.

  • Emergency alerts and warning systems
  • Food and beverage brands (appetite stimulation)
  • Sports teams and athletic wear
  • Calls-to-action and "Buy Now" buttons
  • Pharmaceutical packaging for urgent medications
  • Entertainment and gaming brands
  • Automotive brands emphasizing power and performance
  • Retail sale and clearance signage

Accessibility Considerations

Normal Text

Fails AA

4.5:1 minimum required

Large Text

Passes AA Large

3:1 minimum required

UI Components

Meets 1.4.11

3:1 for non-text UI

Blush Red is a light color. Use black (#000000) text on top of it for maximum readability (6.00:1). Avoid white text on this background.

Test this color in the Contrast Checker →·WCAG Contrast Guide →

CSS & Code Examples

Background

background-color: #DE5D83;

Text

color: #DE5D83;

Border

border: 2px solid #DE5D83;

Box Shadow

box-shadow: 0 4px 20px #DE5D8340;

Gradient

background: linear-gradient(135deg, #DE5D83, #ff8eb2);

Tailwind-style

--color-blush-red: #DE5D83;

Tailwind CSS Utilities

Use arbitrary value syntax in Tailwind CSS to apply Blush Red without a custom config.

Background

bg-[#DE5D83]

Text

text-[#DE5D83]

Border

border-[#DE5D83]

Ring

ring-[#DE5D83]

Fill

fill-[#DE5D83]

From (gradient)

from-[#DE5D83]

Via (gradient)

via-[#DE5D83]

To (gradient)

to-[#DE5D83]

Design Tokens

Ready-to-use Blush Red design token in CSS custom properties, SCSS, Tailwind v3/v4, and JSON formats.

CSS Custom Properties

:root {
  --color-blush-red: #DE5D83;
  --color-blush-red-rgb: 222, 93, 131;
  --color-blush-red-hsl: 342, 66%, 62%;
}

SCSS Variables

$color-blush-red: #DE5D83;
$color-blush-red-rgb: 222, 93, 131;
$color-blush-red-hsl: 342, 66%, 62%;

Tailwind v3 Config

// tailwind.config.js
module.exports = {
  theme: {
    extend: {
      colors: {
        'blush-red': '#DE5D83',
      },
    },
  },
};

Tailwind v4 (@theme)

/* tailwind.css */
@theme {
  --color-blush-red: #DE5D83;
}

JSON Design Token (W3C format)

{
  "blush-red": {
    "value": "#DE5D83",
    "type": "color",
    "description": "Blush Red — #DE5D83"
  }
}

More red colors

View all →

Red

#FF0000

Dark Red

#8B0000

Crimson

#DC143C

Scarlet

#FF2400

Maroon

#800000

Ruby

#9B111E

Cardinal

#C41E3A

Carmine

#960018

Vermilion

#E34234

Coral

#FF7F50

Light Coral

#F08080

Tomato

#FF6347

What Does Blush Red Mean? Color Psychology & Cultural Symbolism

Few colors carry as much cross-cultural psychological weight as the red family. Blush Red channels this heritage—landing in the design spectrum as power, a quality equally present in a "Buy Now" button and a luxury fashion house's logo.

  • In Western cultures red denotes importance (red carpets), danger (stop signs), love (Valentine's Day), and financial loss ("in the red")—a dual symbolism of celebration and warning that designers leverage depending on context.
  • Across China, India, and much of Southeast Asia, red is the color of luck, prosperity, and celebration. It dominates weddings, Lunar New Year, and auspicious occasions, carrying exactly the opposite of its Western "danger" connotation.
  • Blush Red's mid-tone lightness (62%) shifts its psychological register: a balanced mid-tone that embodies energy, passion, urgency, and power at its most direct.
  • At 66% saturation, Blush Red reads as moderately saturated—neither overwhelming nor passive, landing in the energy, passion, urgency, and power zone with measured confidence.

Blush Red earns its place in a palette by doing something specific. Deploy it with that purpose in mind and it will deliver.

How to Use Blush Red in Design: Applications, Pairings & Best Practices

Print and packaging designers reach for Blush Red when shelf visibility is critical. Red-family hues register first in complex visual environments, making them invaluable for products competing for attention at retail.

  • UI components: primary action buttons, error and destructive states, delete confirmations—Blush Red performs reliably in all these roles with its mid-tone tonal character.
  • Brand & identity: call-to-action buttons, promotional banners, food packaging—contexts where Blush Red's moderately saturated quality creates the right register.
  • Typography: Blush Red as text requires a dark background; its 62% lightness means it provides 3.5:1 contrast on white, not meeting WCAG AA.
  • Blush Red creates strong legibility with black text overlays (6.0:1 contrast ratio), making it a reliable background or surface color in design systems
  • Proportional use: Blush Red's moderately saturated saturation (66%) means small applications—accents, highlights, icons—deliver maximum impact without visual fatigue. Reserve large-scale use for intentional brand moments.

Blush Red earns its place in a palette by doing something specific. Deploy it with that purpose in mind and it will deliver.

Blush Red Accessibility: WCAG Contrast Ratios, Color Blindness & Inclusive Design

Blush Red (#DE5D83) reaches 6.00:1 contrast with black text—meeting WCAG 2.1 AA minimum of 4.5:1 for normal text and 3:1 for large text. It clears standard production accessibility requirements. Relative luminance: 25.0%.

  • As text on white (#FFFFFF): 3.50:1 — AA (large text only)
  • As text on black (#000000): 6.00:1 — AA ✓
  • Best text color on Blush Red background: Black (#000000) at 6.00:1
  • WCAG 2.1 luminance: 25.0% — mid-range luminance—it sits in the transition zone where both dark and light text approaches require testing against the 4.5:1 WCAG threshold
  • Blush Red qualifies for normal body text and all larger sizes (AA).
  • Color blindness consideration: protanopia and deuteranopia (red-green color blindness, ~8% of males) may affect how red-family colors are distinguished from greens and browns. For critical UI states, supplement color alone with shape, label, or pattern cues.

Blush Red's WCAG profile makes it a compliant choice for most text applications.

Blush Red in Industry: Branding, Design & Market Applications

Across industry research, red-family tones consistently outperform competitors in categories built on energy, passion, urgency, and power. Blush Red is a mid-tone expression of this advantage—best positioned in Food & Beverage and adjacent markets.

  • Food & Beverage: Red stimulates appetite and accelerates purchase decisions. Fast food chains, hot sauce brands, and snack packaging use it deliberately because it increases caloric craving and speeds up decision-making at point of sale. (examples: Whole Foods, Trader Joe's, Blue Bottle Coffee) Avoid in fine dining or health-food contexts where a slower, more mindful experience is the goal.
  • Retail & E-commerce: The "red sale tag" is a globally conditioned retail convention. Red signals scarcity and urgency, making it the universal shorthand for clearance events, limited-time offers, and price callouts. (examples: Target, H&M, ASOS) Overuse exhausts the urgency signal—reserve it for genuinely time-limited promotions.
  • Sports & Entertainment: Red communicates competition, athletic energy, and tribal passion. From team jerseys to arena signage, it energizes crowds and aligns with the visceral intensity sports brands want to project. (examples: Spotify, Netflix, Hulu) Works best paired with black or white for maximum contrast and visual impact.
  • Brand positioning: Blush Red is best suited for brands projecting energy, passion, importance. Categories outside this positioning—financial dashboards (loss association)—tend to see weaker results.
  • Adjacent applications: Beyond primary industries, Blush Red works effectively in call-to-action buttons, promotional banners, food packaging—contexts where passion serves a secondary but reinforcing role.

Blush Red earns its strongest ROI in industries where trust and recognition compound over time: Food & Beverage, Retail & E-commerce, Sports & Entertainment. Use it to build the kind of brand recognition that decades reinforce.

Accessibility & Design Guides

WCAG Contrast Ratio Guide

Understand contrast requirements for AA and AAA compliance

WCAG AA vs AAA

When to target AA vs AAA accessibility standards

Color Blindness Guide

Design for color vision deficiency with safe palettes

Accessible Design Systems

Build color systems that work for everyone

Frequently Asked Questions

What is the hex code for Blush Red?
▾
The hex code for Blush Red is #DE5D83. Its RGB values are rgb(222, 93, 131) and its HSL values are hsl(342, 66%, 62%).
What does Blush Red mean in design?
▾
Red is the most emotionally intense color in the spectrum. It stimulates the nervous system, accelerates respiration, and increases heart rate. Red commands attention through associations with blood, fire, danger, and passion — making it the dominant choice for warnings, calls-to-action, and brand identities that must stand out instantly. In food culture, red stimulates appetite. In romance, it signals desire. In sport, studies show red-clad competitors win more often. However, overuse creates aggression. The most effective red designs use it sparingly as a focal accent. At medium lightness, it is the most versatile tone of this hue family — readable as text on light backgrounds, yet vibrant enough as a visual accent.
Is Blush Red WCAG accessible?
▾
Blush Red (#DE5D83) passes WCAG AA-large on white with a 3.5:1 contrast ratio. Its overall accessibility score is 39/100.
What colors go well with Blush Red?
▾
Blush Red pairs well with its complementary color Hooker's Green (#49796B). Analogous colors like Byzantium and Dahlia also work harmoniously. Check the Color Harmonies section above for the full palette.
What is Blush Red used for?
▾
Blush Red is commonly used for: Emergency alerts and warning systems; Food and beverage brands (appetite stimulation); Sports teams and athletic wear; Calls-to-action and "Buy Now" buttons; Pharmaceutical packaging for urgent medications.
What are the CSS and Tailwind values for Blush Red?
▾
In CSS, use `color: #DE5D83` or `background-color: #DE5D83`. The CSS custom property is `--color-blush-red: #DE5D83`. In Tailwind CSS, use the arbitrary value class `bg-[#DE5D83]` for backgrounds or `text-[#DE5D83]` for text.