← Back to Editor

#EDD4BE · #DCBB9A · #88888A · #56575C · #98A9B9

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

#EDD4BE

Apricot · Wheat · Peach Orange

HEX
#EDD4BE
RGB
rgb(237, 212, 190)
HSL
hsl(28, 57%, 84%)
HSB
hsb(28, 20%, 93%)
CMYK
cmyk(0%, 11%, 20%, 7%)
Oklch
oklch(88.5% 0.041 63.6)

TraditionalApricot」· PaintPeach Orange」· Creative Honey Glow

#DCBB9A

Goose Yellow · Tan · Warm Sun

HEX
#DCBB9A
RGB
rgb(220, 187, 154)
HSL
hsl(30, 49%, 73%)
HSB
hsb(30, 30%, 86%)
CMYK
cmyk(0%, 15%, 30%, 14%)
Oklch
oklch(81.2% 0.058 66.8)

TraditionalGoose Yellow」· PaintWarm Sun」· Creative Honey Glow

#88888A

Ash · Gray · Warm Gray

HEX
#88888A
RGB
rgb(136, 136, 138)
HSL
hsl(240, 1%, 54%)
HSB
hsb(240, 1%, 54%)
CMYK
cmyk(1%, 1%, 0%, 46%)
Oklch
oklch(62.7% 0.003 286.3)

TraditionalAsh」· PaintWarm Gray」· Creative Urban Concrete

#56575C

Ink Gray · DimGray · Charcoal

HEX
#56575C
RGB
rgb(86, 87, 92)
HSL
hsl(230, 3%, 35%)
HSB
hsb(230, 7%, 36%)
CMYK
cmyk(7%, 5%, 0%, 64%)
Oklch
oklch(45.8% 0.008 277.0)

TraditionalInk Gray」· PaintCharcoal」· Creative Midnight Shadow

#98A9B9

Sky Blue · DarkGray · Cobalt Blue

HEX
#98A9B9
RGB
rgb(152, 169, 185)
HSL
hsl(209, 19%, 66%)
HSB
hsb(209, 18%, 73%)
CMYK
cmyk(18%, 9%, 0%, 27%)
Oklch
oklch(72.7% 0.030 246.6)

TraditionalSky Blue」· PaintCobalt Blue」· Creative Twilight Haze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

EDD4BE
BFD8ED

Analogous

EDBFC0
EDD4BE
EDECBF

Triadic

EDD4BE
BFEDD5
D5BFED

Split-Comp.

EDD4BE
BFEDEC
BFC0ED

Tetradic

EDD4BE
C0EDBF
BFD8ED
ECBFED

Contrast Matrix WCAG 2.1 Contrast

EDD4BE
DCBB9A
88888A
56575C
98A9B9
1.3
Fail
2.5
Fail
5.1
AA
1.7
Fail
1.3
Fail
2.0
Fail
4.0
AA Large
1.3
Fail
2.5
Fail
2.0
Fail
2.0
Fail
1.5
Fail
5.1
AA
4.0
AA Large
2.0
Fail
3.0
Fail
1.7
Fail
1.3
Fail
1.5
Fail
3.0
Fail
White BG
1.4Fail
1.8Fail
3.5AA Large
7.2AAA
2.4Fail
Black BG
14.8AAA
11.6AAA
5.9AA
2.9Fail
8.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E2E2C3
CECDA2
88888A
56565B
9FA0B5

Deuteranopia

E4E5C5
D0D2A4
888889
56565A
9E9DB4

Tritanopia

ECC8C8
DAA8AA
888989
565A5A
99B2B1

Achromatopsia

D9D9D9
C1C1C1
888888
575757
A6A6A6

Shades & Tints Shades & Tints

#EDD4BE

Dark
Light

#DCBB9A

Dark
Light

#88888A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #edd4be;
  --color-2: #dcbb9a;
  --color-3: #88888a;
  --color-4: #56575c;
  --color-5: #98a9b9;
}

SCSS

$color-1: #edd4be;
$color-2: #dcbb9a;
$color-3: #88888a;
$color-4: #56575c;
$color-5: #98a9b9;

TAILWIND

colors: {
  'brand-1': '#edd4be',
  'brand-2': '#dcbb9a',
  'brand-3': '#88888a',
  'brand-4': '#56575c',
  'brand-5': '#98a9b9',
}

RGB Array

[237, 212, 190], [220, 187, 154], [136, 136, 138], [86, 87, 92], [152, 169, 185]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #EDD4BE, #DCBB9A, #88888A, #56575C, #98A9B9 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: #edd4be; --color-2: #dcbb9a; --color-3: #88888a; --color-4: #56575c; --color-5: #98a9b9. 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