#E32D61 + #DE7661 + #CEAF77 + #B4D8A3 + #D8D9BD - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#E32D61

Dark Violet · Crimson · Rose Pink

HEX

#E32D61

RGB

rgb(227, 45, 97)

HSL

hsl(343, 76%, 53%)

HSB

hsb(343, 80%, 89%)

CMYK

cmyk(0%, 80%, 57%, 11%)

Oklch

oklch(60.3% 0.215 10.9)

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

#DE7661

Peach Pink · Salmon · Coral Red

HEX

#DE7661

RGB

rgb(222, 118, 97)

HSL

hsl(10, 65%, 63%)

HSB

hsb(10, 56%, 87%)

CMYK

cmyk(0%, 47%, 56%, 13%)

Oklch

oklch(67.9% 0.134 32.6)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#CEAF77

Ginger · Tan · Warm Sun

HEX

#CEAF77

RGB

rgb(206, 175, 119)

HSL

hsl(39, 47%, 64%)

HSB

hsb(39, 42%, 81%)

CMYK

cmyk(0%, 15%, 42%, 19%)

Oklch

oklch(76.8% 0.082 81.8)

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

#B4D8A3

Celadon · Silver · Apple Green

HEX

#B4D8A3

RGB

rgb(180, 216, 163)

HSL

hsl(101, 40%, 74%)

HSB

hsb(101, 25%, 85%)

CMYK

cmyk(17%, 0%, 25%, 15%)

Oklch

oklch(84.3% 0.081 135.8)

Traditional「Celadon」· Paint「Apple Green」· Creative Mint Breeze

#D8D9BD

Fresh Green · LightGray · Lemon Cream

HEX

#D8D9BD

RGB

rgb(216, 217, 189)

HSL

hsl(62, 27%, 80%)

HSB

hsb(62, 13%, 85%)

CMYK

cmyk(0%, 0%, 13%, 15%)

Oklch

oklch(87.7% 0.037 108.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E32D61

2CE2AF

Analogous

E22CBB

E32D61

E2542C

Triadic

E32D61

60E22C

2C60E2

Split-Comp.

E32D61

2CE254

2CBBE2

Tetradic

E32D61

BBE22C

2CE2AF

542CE2

Contrast Matrix WCAG 2.1 Contrast

E32D61	DE7661	CEAF77	B4D8A3	D8D9BD
—	1.4 Fail	2.1 Fail	2.8 Fail	3.0 AA Large
1.4 Fail	—	1.5 Fail	1.9 Fail	2.1 Fail
2.1 Fail	1.5 Fail	—	1.3 Fail	1.5 Fail
2.8 Fail	1.9 Fail	1.3 Fail	—	1.1 Fail
3.0 AA Large	2.1 Fail	1.5 Fail	1.1 Fail	—

White BG

4.4AA Large

3.1AA Large

2.1Fail

1.6Fail

1.4Fail

Black BG

4.8AA

6.9AA

10.0AAA

13.3AAA

14.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

949354

B1B066

C1C085

C4C4B0

D8D8C4

Deuteranopia

9FAC51

B7BF67

C2C588

C2BFB3

D8D8C5

Tritanopia

DA4A48

D96A6B

CC8F92

B6BABC

D8C9CA

Achromatopsia

696969

939393

B2B2B2

C7C7C7

D6D6D6

Shades & Tints Shades & Tints

#E32D61

Dark

Light

#DE7661

Dark

Light

#CEAF77

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e32d61;
  --color-2: #de7661;
  --color-3: #ceaf77;
  --color-4: #b4d8a3;
  --color-5: #d8d9bd;
}

SCSS

$color-1: #e32d61;
$color-2: #de7661;
$color-3: #ceaf77;
$color-4: #b4d8a3;
$color-5: #d8d9bd;

TAILWIND

colors: {
  'brand-1': '#e32d61',
  'brand-2': '#de7661',
  'brand-3': '#ceaf77',
  'brand-4': '#b4d8a3',
  'brand-5': '#d8d9bd',
}

RGB Array

[227, 45, 97], [222, 118, 97], [206, 175, 119], [180, 216, 163], [216, 217, 189]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E32D61, #DE7661, #CEAF77, #B4D8A3, #D8D9BD is ideal for: health products, baby brands, fresh-style blogs. 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: #e32d61; --color-2: #de7661; --color-3: #ceaf77; --color-4: #b4d8a3; --color-5: #d8d9bd. 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?

Light tones suit backgrounds; use dark colors for body text. Mid-tones work for card backgrounds or dividers to add depth. 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