#E51E5F + #D53368 + #C14C73 + #AD667D + #9B7D87 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#E51E5F

Dark Violet · Crimson · Rose Pink

HEX

#E51E5F

RGB

rgb(229, 30, 95)

HSL

hsl(340, 79%, 51%)

HSB

hsb(340, 87%, 90%)

CMYK

cmyk(0%, 87%, 59%, 10%)

Oklch

oklch(59.8% 0.226 10.4)

Traditional「Dark Violet」· Paint「Rose Pink」· Creative Blush Sunrise

#D53368

Dark Violet · MediumVioletRed · Rose Pink

HEX

#D53368

RGB

rgb(213, 51, 104)

HSL

hsl(340, 66%, 52%)

HSB

hsb(340, 76%, 84%)

CMYK

cmyk(0%, 76%, 51%, 16%)

Oklch

oklch(58.5% 0.199 6.7)

Traditional「Dark Violet」· Paint「Rose Pink」· Creative Blush Sunrise

#C14C73

Dark Violet · MediumVioletRed · Rose Pink

HEX

#C14C73

RGB

rgb(193, 76, 115)

HSL

hsl(340, 49%, 53%)

HSB

hsb(340, 61%, 76%)

CMYK

cmyk(0%, 61%, 40%, 24%)

Oklch

oklch(58.2% 0.154 2.4)

Traditional「Dark Violet」· Paint「Rose Pink」· Creative Blush Sunrise

#AD667D

Dark Violet · Gray · Rose Pink

HEX

#AD667D

RGB

rgb(173, 102, 125)

HSL

hsl(341, 30%, 54%)

HSB

hsb(341, 41%, 68%)

CMYK

cmyk(0%, 41%, 28%, 32%)

Oklch

oklch(59.6% 0.095 359.6)

Traditional「Dark Violet」· Paint「Rose Pink」· Creative Blush Sunrise

#9B7D87

Dark Violet · Gray · Rose Pink

HEX

#9B7D87

RGB

rgb(155, 125, 135)

HSL

hsl(340, 13%, 55%)

HSB

hsb(340, 19%, 61%)

CMYK

cmyk(0%, 19%, 13%, 39%)

Oklch

oklch(62.1% 0.040 356.4)

Traditional「Dark Violet」· Paint「Rose Pink」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E51E5F

1FE5A3

Analogous

E51FC4

E51E5F

E5401F

Triadic

E51E5F

61E51F

1F61E5

Split-Comp.

E51E5F

1FE540

1FC4E5

Tetradic

E51E5F

C4E51F

1FE5A3

401FE5

Contrast Matrix WCAG 2.1 Contrast

E51E5F	D53368	C14C73	AD667D	9B7D87
—	1.0 Fail	1.0 Fail	1.1 Fail	1.2 Fail
1.0 Fail	—	1.0 Fail	1.1 Fail	1.3 Fail
1.0 Fail	1.0 Fail	—	1.1 Fail	1.2 Fail
1.1 Fail	1.1 Fail	1.1 Fail	—	1.1 Fail
1.2 Fail	1.3 Fail	1.2 Fail	1.1 Fail	—

White BG

4.5AA Large

4.7AA

4.6AA

4.2AA Large

3.7AA Large

Black BG

4.7AA

4.5AA

5.0AA

5.7AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

8F8D4F

8F8D5B

8E8D6A

8E8E77

8E8E85

Deuteranopia

9AA94C

98A458

959E67

929876

909284

Tritanopia

DB4340

CD514F

BB6260

A97372

9A8382

Achromatopsia

616161

696969

737373

7E7E7E

878787

Shades & Tints Shades & Tints

#E51E5F

Dark

Light

#D53368

Dark

Light

#C14C73

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e51e5f;
  --color-2: #d53368;
  --color-3: #c14c73;
  --color-4: #ad667d;
  --color-5: #9b7d87;
}

SCSS

$color-1: #e51e5f;
$color-2: #d53368;
$color-3: #c14c73;
$color-4: #ad667d;
$color-5: #9b7d87;

TAILWIND

colors: {
  'brand-1': '#e51e5f',
  'brand-2': '#d53368',
  'brand-3': '#c14c73',
  'brand-4': '#ad667d',
  'brand-5': '#9b7d87',
}

RGB Array

[229, 30, 95], [213, 51, 104], [193, 76, 115], [173, 102, 125], [155, 125, 135]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E51E5F, #D53368, #C14C73, #AD667D, #9B7D87 is ideal for: corporate websites, product showcases, portfolios. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #e51e5f; --color-2: #d53368; --color-3: #c14c73; --color-4: #ad667d; --color-5: #9b7d87. LangColor editor supports one-click export to CSS, SCSS, Tailwind, JSON and more. Click the "Export" button to choose your format.

What UI/UX design tips apply to this palette?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. Use the "Contrast Matrix" tool in LangColor editor to check WCAG accessibility levels for every color pair.

Which industries or brands suit this palette?

This general-style 5-color scheme is especially suited for tech, SaaS, healthcare, eco industries. Click "AI Analysis" in the editor for more detailed brand color suggestions.

🎨 Open this palette in Editor →

Generated by LangColor online color tool · Breaking the barrier between language and color