← Back to Editor

#DAE1D0 · #AEDBCA · #9DB5C0 · #8C8CB8 · #4D2933

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

#DAE1D0

Willow Green · LightGray · Mint Green

HEX
#DAE1D0
RGB
rgb(218, 225, 208)
HSL
hsl(85, 22%, 85%)
HSB
hsb(85, 8%, 88%)
CMYK
cmyk(3%, 0%, 8%, 12%)
Oklch
oklch(90.0% 0.024 125.2)

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

#AEDBCA

Jade · LightBlue · Apple Green

HEX
#AEDBCA
RGB
rgb(174, 219, 202)
HSL
hsl(157, 38%, 77%)
HSB
hsb(157, 21%, 86%)
CMYK
cmyk(21%, 0%, 8%, 14%)
Oklch
oklch(85.5% 0.053 170.0)

Traditional「Jade」· Paint「Apple Green」· Creative Arctic Pool

#9DB5C0

Sky Blue · DarkGray · Lake Green

HEX
#9DB5C0
RGB
rgb(157, 181, 192)
HSL
hsl(199, 22%, 68%)
HSB
hsb(199, 18%, 75%)
CMYK
cmyk(18%, 6%, 0%, 25%)
Oklch
oklch(75.8% 0.031 227.2)

Traditional「Sky Blue」· Paint「Lake Green」· Creative Arctic Pool

#8C8CB8

Wisteria · LightSlateGray · Cobalt Blue

HEX
#8C8CB8
RGB
rgb(140, 140, 184)
HSL
hsl(240, 24%, 64%)
HSB
hsb(240, 24%, 72%)
CMYK
cmyk(24%, 24%, 0%, 28%)
Oklch
oklch(65.6% 0.065 284.5)

Traditional「Wisteria」· Paint「Cobalt Blue」· Creative Lavender Dream

#4D2933

Dark Violet · DarkSlateGray · Raspberry

HEX
#4D2933
RGB
rgb(77, 41, 51)
HSL
hsl(343, 31%, 23%)
HSB
hsb(343, 47%, 30%)
CMYK
cmyk(0%, 47%, 34%, 70%)
Oklch
oklch(33.1% 0.055 2.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

DAE1D0
D7D0E1

Analogous

E1E0D0
DAE1D0
D2E1D0

Triadic

DAE1D0
D0DAE1
E1D0DA

Split-Comp.

DAE1D0
D0D2E1
E0D0E1

Tetradic

DAE1D0
D0E1E0
D7D0E1
E1D0D2

Contrast Matrix WCAG 2.1 Contrast

DAE1D0
AEDBCA
9DB5C0
8C8CB8
4D2933
—
1.1
Fail
1.6
Fail
2.4
Fail
9.3
AAA
1.1
Fail
—
1.4
Fail
2.1
Fail
8.2
AAA
1.6
Fail
1.4
Fail
—
1.5
Fail
5.8
AA
2.4
Fail
2.1
Fail
1.5
Fail
—
3.9
AA Large
9.3
AAA
8.2
AAA
5.8
AA
3.9
AA Large
—
White BG
1.3Fail
1.5Fail
2.1Fail
3.2AA Large
12.5AAA
Black BG
15.7AAA
13.8AAA
9.8AAA
6.6AA
1.7Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

DDDDD4
C1C2CE
A7A8BD
8C8CAD
3D3D31

Deuteranopia

DDDCD5
BFBCCF
A6A4BD
8C8CAB
404230

Tritanopia

DAD7D8
B0D1D2
9EBBBB
8CA5A3
4B2F2E

Achromatopsia

DDDDDD
CCCCCC
AFAFAF
919191
353535

Shades & Tints Shades & Tints

#DAE1D0

Dark
Light

#AEDBCA

Dark
Light

#9DB5C0

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #dae1d0;
  --color-2: #aedbca;
  --color-3: #9db5c0;
  --color-4: #8c8cb8;
  --color-5: #4d2933;
}

SCSS

$color-1: #dae1d0;
$color-2: #aedbca;
$color-3: #9db5c0;
$color-4: #8c8cb8;
$color-5: #4d2933;

TAILWIND

colors: {
  'brand-1': '#dae1d0',
  'brand-2': '#aedbca',
  'brand-3': '#9db5c0',
  'brand-4': '#8c8cb8',
  'brand-5': '#4d2933',
}

RGB Array

[218, 225, 208], [174, 219, 202], [157, 181, 192], [140, 140, 184], [77, 41, 51]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #DAE1D0, #AEDBCA, #9DB5C0, #8C8CB8, #4D2933 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: #dae1d0; --color-2: #aedbca; --color-3: #9db5c0; --color-4: #8c8cb8; --color-5: #4d2933. 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