← Back to Editor

#D3CFD9 · #BEADBA · #847C8D · #5D4872 · #4E3966

sunset

A 5-color sunset 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

#D3CFD9

Wisteria · LightGray · Lavender

HEX
#D3CFD9
RGB
rgb(211, 207, 217)
HSL
hsl(264, 12%, 83%)
HSB
hsb(264, 5%, 85%)
CMYK
cmyk(3%, 5%, 0%, 15%)
Oklch
oklch(86.1% 0.014 304.1)

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

#BEADBA

Mauve · Silver · Lilac Purple

HEX
#BEADBA
RGB
rgb(190, 173, 186)
HSL
hsl(314, 12%, 71%)
HSB
hsb(314, 9%, 75%)
CMYK
cmyk(0%, 9%, 2%, 25%)
Oklch
oklch(76.6% 0.026 333.9)

Traditional「Mauve」· Paint「Lilac Purple」· Creative Rose Petal

#847C8D

Ash · Gray · Warm Gray

HEX
#847C8D
RGB
rgb(132, 124, 141)
HSL
hsl(268, 7%, 52%)
HSB
hsb(268, 12%, 55%)
CMYK
cmyk(6%, 12%, 0%, 45%)
Oklch
oklch(59.9% 0.027 306.7)

Traditional「Ash」· Paint「Warm Gray」· Creative Urban Concrete

#5D4872

Dark Plum · DarkSlateBlue · Eggplant

HEX
#5D4872
RGB
rgb(93, 72, 114)
HSL
hsl(270, 23%, 36%)
HSB
hsb(270, 37%, 45%)
CMYK
cmyk(18%, 37%, 0%, 55%)
Oklch
oklch(44.1% 0.072 306.6)

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

#4E3966

Deep Indigo · DarkSlateBlue · Eggplant

HEX
#4E3966
RGB
rgb(78, 57, 102)
HSL
hsl(268, 28%, 31%)
HSB
hsb(268, 44%, 40%)
CMYK
cmyk(24%, 44%, 0%, 60%)
Oklch
oklch(38.8% 0.078 304.5)

Traditional「Deep Indigo」· Paint「Eggplant」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D3CFD9
D5D9CE

Analogous

CECFD9
D3CFD9
D8CED9

Triadic

D3CFD9
D9D3CE
CED9D3

Split-Comp.

D3CFD9
D9D8CE
CFD9CE

Tetradic

D3CFD9
D9CECF
D5D9CE
CED9D8

Contrast Matrix WCAG 2.1 Contrast

D3CFD9
BEADBA
847C8D
5D4872
4E3966
—
1.4
Fail
2.6
Fail
5.2
AA
6.5
AA
1.4
Fail
—
1.9
Fail
3.7
AA Large
4.7
AA
2.6
Fail
1.9
Fail
—
2.0
Fail
2.5
Fail
5.2
AA
3.7
AA Large
2.0
Fail
—
1.3
Fail
6.5
AA
4.7
AA
2.5
Fail
1.3
Fail
—
White BG
1.5Fail
2.1Fail
4.0AA Large
8.0AAA
10.0AAA
Black BG
13.7AAA
9.9AAA
5.2AA
2.6Fail
2.1Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

D1D1D7
B7B6B7
818089
545468
45455B

Deuteranopia

D2D2D6
B8B9B6
818288
555765
464858

Tritanopia

D3D5D4
BDB4B4
848685
5C605E
4D5351

Achromatopsia

D1D1D1
B4B4B4
808080
535353
444444

Shades & Tints Shades & Tints

#D3CFD9

Dark
Light

#BEADBA

Dark
Light

#847C8D

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d3cfd9;
  --color-2: #beadba;
  --color-3: #847c8d;
  --color-4: #5d4872;
  --color-5: #4e3966;
}

SCSS

$color-1: #d3cfd9;
$color-2: #beadba;
$color-3: #847c8d;
$color-4: #5d4872;
$color-5: #4e3966;

TAILWIND

colors: {
  'brand-1': '#d3cfd9',
  'brand-2': '#beadba',
  'brand-3': '#847c8d',
  'brand-4': '#5d4872',
  'brand-5': '#4e3966',
}

RGB Array

[211, 207, 217], [190, 173, 186], [132, 124, 141], [93, 72, 114], [78, 57, 102]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sunset-style palette of #D3CFD9, #BEADBA, #847C8D, #5D4872, #4E3966 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: #d3cfd9; --color-2: #beadba; --color-3: #847c8d; --color-4: #5d4872; --color-5: #4e3966. 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 sunset-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