← Back to Editor

#D2D5DE · #D1CFC0 · #EF9688 · #956163 · #534D51

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

#D2D5DE

Azure · LightGray · Sky Blue

HEX
#D2D5DE
RGB
rgb(210, 213, 222)
HSL
hsl(225, 15%, 85%)
HSB
hsb(225, 5%, 87%)
CMYK
cmyk(5%, 4%, 0%, 13%)
Oklch
oklch(87.3% 0.013 271.3)

Traditional「Azure」· Paint「Sky Blue」· Creative Twilight Haze

#D1CFC0

Fresh Green · LightGray · Lemon Cream

HEX
#D1CFC0
RGB
rgb(209, 207, 192)
HSL
hsl(53, 16%, 79%)
HSB
hsb(53, 8%, 82%)
CMYK
cmyk(0%, 1%, 8%, 18%)
Oklch
oklch(85.2% 0.020 100.6)

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

#EF9688

Peach Pink · DarkSalmon · Coral Red

HEX
#EF9688
RGB
rgb(239, 150, 136)
HSL
hsl(8, 76%, 74%)
HSB
hsb(8, 43%, 94%)
CMYK
cmyk(0%, 37%, 43%, 6%)
Oklch
oklch(76.1% 0.110 29.5)

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

#956163

Crimson · DimGray · Passion Red

HEX
#956163
RGB
rgb(149, 97, 99)
HSL
hsl(358, 21%, 48%)
HSB
hsb(358, 35%, 58%)
CMYK
cmyk(0%, 35%, 34%, 42%)
Oklch
oklch(54.9% 0.068 17.0)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

#534D51

Ink Gray · DarkSlateGray · Charcoal

HEX
#534D51
RGB
rgb(83, 77, 81)
HSL
hsl(320, 4%, 31%)
HSB
hsb(320, 7%, 33%)
CMYK
cmyk(0%, 7%, 2%, 67%)
Oklch
oklch(42.7% 0.010 337.7)

Traditional「Ink Gray」· Paint「Charcoal」· Creative Midnight Shadow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D2D5DE
DEDCD3

Analogous

D3DCDE
D2D5DE
D6D3DE

Triadic

D2D5DE
DED3D6
D6DED3

Split-Comp.

D2D5DE
DED6D3
DCDED3

Tetradic

D2D5DE
DED3DC
DEDCD3
D3DED6

Contrast Matrix WCAG 2.1 Contrast

D2D5DE
D1CFC0
EF9688
956163
534D51
—
1.1
Fail
1.5
Fail
3.4
AA Large
5.6
AA
1.1
Fail
—
1.4
Fail
3.2
AA Large
5.3
AA
1.5
Fail
1.4
Fail
—
2.3
Fail
3.7
AA Large
3.4
AA Large
3.2
AA Large
2.3
Fail
—
1.6
Fail
5.6
AA
5.3
AA
3.7
AA Large
1.6
Fail
—
White BG
1.5Fail
1.6Fail
2.2Fail
5.0AA
8.2AAA
Black BG
14.3AAA
13.4AAA
9.4AAA
4.2AA Large
2.5Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

D3D3DC
D0D0C4
C8C88B
7E7E63
505050

Deuteranopia

D3D3DB
D0D0C4
CED48C
828562
515150

Tritanopia

D2DADA
D1C6C7
EB8E8F
926262
534F4F

Achromatopsia

D5D5D5
CECECE
AFAFAF
717171
4F4F4F

Shades & Tints Shades & Tints

#D2D5DE

Dark
Light

#D1CFC0

Dark
Light

#EF9688

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d2d5de;
  --color-2: #d1cfc0;
  --color-3: #ef9688;
  --color-4: #956163;
  --color-5: #534d51;
}

SCSS

$color-1: #d2d5de;
$color-2: #d1cfc0;
$color-3: #ef9688;
$color-4: #956163;
$color-5: #534d51;

TAILWIND

colors: {
  'brand-1': '#d2d5de',
  'brand-2': '#d1cfc0',
  'brand-3': '#ef9688',
  'brand-4': '#956163',
  'brand-5': '#534d51',
}

RGB Array

[210, 213, 222], [209, 207, 192], [239, 150, 136], [149, 97, 99], [83, 77, 81]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D2D5DE, #D1CFC0, #EF9688, #956163, #534D51 is ideal for: brand design, premium product pages, magazine layouts, infographics, data visualization, accessible design. Low-saturation colors convey a sophisticated, premium feel. High contrast ensures clear visual hierarchy and readability. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #d2d5de; --color-2: #d1cfc0; --color-3: #ef9688; --color-4: #956163; --color-5: #534d51. 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. Restrained colors convey professionalism and trust. 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