← Back to Editor

#E0DAED · #C8C3D9 · #7C768C · #B4CCC7 · #D0DBD9

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#E0DAED

Wisteria · Lavender · Sky Blue

HEX
#E0DAED
RGB
rgb(224, 218, 237)
HSL
hsl(259, 35%, 89%)
HSB
hsb(259, 8%, 93%)
CMYK
cmyk(5%, 8%, 0%, 7%)
Oklch
oklch(89.9% 0.026 300.2)

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

#C8C3D9

Wisteria · LightGray · Sky Blue

HEX
#C8C3D9
RGB
rgb(200, 195, 217)
HSL
hsl(254, 22%, 81%)
HSB
hsb(254, 10%, 85%)
CMYK
cmyk(8%, 10%, 0%, 15%)
Oklch
oklch(82.8% 0.031 296.1)

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

#7C768C

Deep Indigo · Gray · Warm Gray

HEX
#7C768C
RGB
rgb(124, 118, 140)
HSL
hsl(256, 9%, 51%)
HSB
hsb(256, 16%, 55%)
CMYK
cmyk(11%, 16%, 0%, 45%)
Oklch
oklch(57.9% 0.034 297.8)

Traditional「Deep Indigo」· Paint「Warm Gray」· Creative Urban Concrete

#B4CCC7

Jade · Silver · Lake Green

HEX
#B4CCC7
RGB
rgb(180, 204, 199)
HSL
hsl(167, 19%, 75%)
HSB
hsb(167, 12%, 80%)
CMYK
cmyk(12%, 0%, 2%, 20%)
Oklch
oklch(82.6% 0.027 181.7)

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

#D0DBD9

Jade · LightGray · Glacier Blue

HEX
#D0DBD9
RGB
rgb(208, 219, 217)
HSL
hsl(169, 13%, 84%)
HSB
hsb(169, 5%, 86%)
CMYK
cmyk(5%, 0%, 1%, 14%)
Oklch
oklch(88.2% 0.012 184.0)

Traditional「Jade」· Paint「Glacier Blue」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E0DAED
E7EDD9

Analogous

D9DDED
E0DAED
E9D9ED

Triadic

E0DAED
EDDFD9
D9EDDF

Split-Comp.

E0DAED
EDE9D9
DDEDD9

Tetradic

E0DAED
EDD9DD
E7EDD9
D9EDE9

Contrast Matrix WCAG 2.1 Contrast

E0DAED
C8C3D9
7C768C
B4CCC7
D0DBD9
—
1.3
Fail
3.2
AA Large
1.2
Fail
1.0
Fail
1.3
Fail
—
2.5
Fail
1.0
Fail
1.2
Fail
3.2
AA Large
2.5
Fail
—
2.6
Fail
3.1
AA Large
1.2
Fail
1.0
Fail
2.6
Fail
—
1.2
Fail
1.0
Fail
1.2
Fail
3.1
AA Large
1.2
Fail
—
White BG
1.4Fail
1.7Fail
4.4AA Large
1.7Fail
1.4Fail
Black BG
15.4AAA
12.3AAA
4.8AA
12.4AAA
14.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

DDDDE8
C6C6D4
797987
BEBFC8
D5D5D9

Deuteranopia

DEDEE7
C6C7D2
7A7A85
BDBBC8
D4D3DA

Tritanopia

E0E5E4
C8CFCF
7C8282
B5C9C9
D1DADA

Achromatopsia

DEDEDE
C7C7C7
7A7A7A
C4C4C4
D7D7D7

Shades & Tints Shades & Tints

#E0DAED

Dark
Light

#C8C3D9

Dark
Light

#7C768C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e0daed;
  --color-2: #c8c3d9;
  --color-3: #7c768c;
  --color-4: #b4ccc7;
  --color-5: #d0dbd9;
}

SCSS

$color-1: #e0daed;
$color-2: #c8c3d9;
$color-3: #7c768c;
$color-4: #b4ccc7;
$color-5: #d0dbd9;

TAILWIND

colors: {
  'brand-1': '#e0daed',
  'brand-2': '#c8c3d9',
  'brand-3': '#7c768c',
  'brand-4': '#b4ccc7',
  'brand-5': '#d0dbd9',
}

RGB Array

[224, 218, 237], [200, 195, 217], [124, 118, 140], [180, 204, 199], [208, 219, 217]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E0DAED, #C8C3D9, #7C768C, #B4CCC7, #D0DBD9 is ideal for: brand design, premium product pages, magazine layouts, health products, baby brands, fresh-style blogs. Low-saturation colors convey a sophisticated, premium feel. 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: #e0daed; --color-2: #c8c3d9; --color-3: #7c768c; --color-4: #b4ccc7; --color-5: #d0dbd9. 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 beauty, lifestyle, arts 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