← Back to Editor

#D1E9CE · #DBCAA8 · #E57583 · #5F4661 · #303638

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#D1E9CE

Celadon · LightGray · Mint Green

HEX
#D1E9CE
RGB
rgb(209, 233, 206)
HSL
hsl(113, 38%, 86%)
HSB
hsb(113, 12%, 91%)
CMYK
cmyk(10%, 0%, 12%, 9%)
Oklch
oklch(90.9% 0.044 142.1)

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

#DBCAA8

Goose Yellow · Wheat · Lemon Cream

HEX
#DBCAA8
RGB
rgb(219, 202, 168)
HSL
hsl(40, 41%, 76%)
HSB
hsb(40, 23%, 86%)
CMYK
cmyk(0%, 8%, 23%, 14%)
Oklch
oklch(84.4% 0.049 84.5)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#E57583

Peach Pink · LightCoral · Coral Red

HEX
#E57583
RGB
rgb(229, 117, 131)
HSL
hsl(353, 68%, 68%)
HSB
hsb(353, 49%, 90%)
CMYK
cmyk(0%, 49%, 43%, 10%)
Oklch
oklch(69.4% 0.139 13.5)

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

#5F4661

Dark Plum · DimGray · Eggplant

HEX
#5F4661
RGB
rgb(95, 70, 97)
HSL
hsl(296, 16%, 33%)
HSB
hsb(296, 28%, 38%)
CMYK
cmyk(2%, 28%, 0%, 62%)
Oklch
oklch(43.1% 0.054 324.0)

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

#303638

Slate Blue · DarkSlateGray · Dark Stone

HEX
#303638
RGB
rgb(48, 54, 56)
HSL
hsl(195, 8%, 20%)
HSB
hsb(195, 14%, 22%)
CMYK
cmyk(14%, 4%, 0%, 78%)
Oklch
oklch(32.8% 0.009 219.7)

Traditional「Slate Blue」· Paint「Dark Stone」· Creative Midnight Shadow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D1E9CE
E6CEE9

Analogous

DEE9CE
D1E9CE
CEE9D8

Triadic

D1E9CE
CED1E9
E9CED1

Split-Comp.

D1E9CE
D8CEE9
E9CEDE

Tetradic

D1E9CE
CEDEE9
E6CEE9
E9D8CE

Contrast Matrix WCAG 2.1 Contrast

D1E9CE
DBCAA8
E57583
5F4661
303638
—
1.2
Fail
2.3
Fail
6.4
AA
9.5
AAA
1.2
Fail
—
1.8
Fail
5.1
AA
7.6
AAA
2.3
Fail
1.8
Fail
—
2.8
Fail
4.2
AA Large
6.4
AA
5.1
AA
2.8
Fail
—
1.5
Fail
9.5
AAA
7.6
AAA
4.2
AA Large
1.5
Fail
—
White BG
1.3Fail
1.6Fail
2.9Fail
8.3AAA
12.3AAA
Black BG
16.3AAA
13.0AAA
7.2AAA
2.5Fail
1.7Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

DBDCD5
D4D3B0
B5B380
54545A
333338

Deuteranopia

DAD8D6
D5D6B2
BBC37F
565859
323237

Tritanopia

D2DADB
DAB7B8
DF7D7C
5E5554
303737

Achromatopsia

DFDFDF
CBCBCB
989898
515151
343434

Shades & Tints Shades & Tints

#D1E9CE

Dark
Light

#DBCAA8

Dark
Light

#E57583

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d1e9ce;
  --color-2: #dbcaa8;
  --color-3: #e57583;
  --color-4: #5f4661;
  --color-5: #303638;
}

SCSS

$color-1: #d1e9ce;
$color-2: #dbcaa8;
$color-3: #e57583;
$color-4: #5f4661;
$color-5: #303638;

TAILWIND

colors: {
  'brand-1': '#d1e9ce',
  'brand-2': '#dbcaa8',
  'brand-3': '#e57583',
  'brand-4': '#5f4661',
  'brand-5': '#303638',
}

RGB Array

[209, 233, 206], [219, 202, 168], [229, 117, 131], [95, 70, 97], [48, 54, 56]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D1E9CE, #DBCAA8, #E57583, #5F4661, #303638 is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. 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: #d1e9ce; --color-2: #dbcaa8; --color-3: #e57583; --color-4: #5f4661; --color-5: #303638. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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