← Back to Editor

#E8708C · #DCA581 · #D0DF77 · #A57C8C · #906D95

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#E8708C

Peach Pink · LightCoral · Coral Red

HEX
#E8708C
RGB
rgb(232, 112, 140)
HSL
hsl(346, 72%, 67%)
HSB
hsb(346, 52%, 91%)
CMYK
cmyk(0%, 52%, 40%, 9%)
Oklch
oklch(69.3% 0.150 7.1)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

#DCA581

Apricot · BurlyWood · Warm Sun

HEX
#DCA581
RGB
rgb(220, 165, 129)
HSL
hsl(24, 57%, 68%)
HSB
hsb(24, 41%, 86%)
CMYK
cmyk(0%, 25%, 41%, 14%)
Oklch
oklch(76.5% 0.082 54.4)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#D0DF77

Fresh Green · Khaki · Sunflower

HEX
#D0DF77
RGB
rgb(208, 223, 119)
HSL
hsl(69, 62%, 67%)
HSB
hsb(69, 47%, 87%)
CMYK
cmyk(7%, 0%, 47%, 13%)
Oklch
oklch(87.0% 0.130 115.9)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

#A57C8C

Dark Violet · Gray · Rose Pink

HEX
#A57C8C
RGB
rgb(165, 124, 140)
HSL
hsl(337, 19%, 57%)
HSB
hsb(337, 25%, 65%)
CMYK
cmyk(0%, 25%, 15%, 35%)
Oklch
oklch(63.1% 0.055 353.6)

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

#906D95

Dark Plum · Gray · Violet

HEX
#906D95
RGB
rgb(144, 109, 149)
HSL
hsl(293, 16%, 51%)
HSB
hsb(293, 27%, 58%)
CMYK
cmyk(3%, 27%, 0%, 42%)
Oklch
oklch(58.4% 0.073 322.2)

Traditional「Dark Plum」· Paint「Violet」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E8708C
6EE7CB

Analogous

E76EC7
E8708C
E78F6E

Triadic

E8708C
8BE76E
6E8BE7

Split-Comp.

E8708C
6EE78F
6EC7E7

Tetradic

E8708C
C7E76E
6EE7CB
8F6EE7

Contrast Matrix WCAG 2.1 Contrast

E8708C
DCA581
D0DF77
A57C8C
906D95
—
1.4
Fail
2.0
Fail
1.2
Fail
1.5
Fail
1.4
Fail
—
1.5
Fail
1.7
Fail
2.0
Fail
2.0
Fail
1.5
Fail
—
2.5
Fail
3.0
AA Large
1.2
Fail
1.7
Fail
2.5
Fail
—
1.2
Fail
1.5
Fail
2.0
Fail
3.0
AA Large
1.2
Fail
—
White BG
2.9Fail
2.2Fail
1.4Fail
3.6AA Large
4.4AA Large
Black BG
7.1AAA
9.7AAA
14.5AAA
5.9AA
4.8AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B4B385
C4C48A
D6D790
939388
81818B

Deuteranopia

BBC484
C7CC8C
D6D596
969987
838689

Tritanopia

E2807F
D99192
D1A4A8
A38584
8E8482

Achromatopsia

979797
B1B1B1
CFCFCF
8A8A8A
7C7C7C

Shades & Tints Shades & Tints

#E8708C

Dark
Light

#DCA581

Dark
Light

#D0DF77

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e8708c;
  --color-2: #dca581;
  --color-3: #d0df77;
  --color-4: #a57c8c;
  --color-5: #906d95;
}

SCSS

$color-1: #e8708c;
$color-2: #dca581;
$color-3: #d0df77;
$color-4: #a57c8c;
$color-5: #906d95;

TAILWIND

colors: {
  'brand-1': '#e8708c',
  'brand-2': '#dca581',
  'brand-3': '#d0df77',
  'brand-4': '#a57c8c',
  'brand-5': '#906d95',
}

RGB Array

[232, 112, 140], [220, 165, 129], [208, 223, 119], [165, 124, 140], [144, 109, 149]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E8708C, #DCA581, #D0DF77, #A57C8C, #906D95 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: #e8708c; --color-2: #dca581; --color-3: #d0df77; --color-4: #a57c8c; --color-5: #906d95. 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