← Back to Editor

#D1E8E3 · #7D546B · #452738 · #781C40 · #961A33

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

#D1E8E3

Jade · LightGray · Glacier Blue

HEX
#D1E8E3
RGB
rgb(209, 232, 227)
HSL
hsl(167, 33%, 86%)
HSB
hsb(167, 10%, 91%)
CMYK
cmyk(10%, 0%, 2%, 9%)
Oklch
oklch(91.3% 0.025 181.2)

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

#7D546B

Rose Purple · DimGray · Camellia

HEX
#7D546B
RGB
rgb(125, 84, 107)
HSL
hsl(326, 20%, 41%)
HSB
hsb(326, 33%, 49%)
CMYK
cmyk(0%, 33%, 14%, 51%)
Oklch
oklch(49.8% 0.063 344.9)

Traditional「Rose Purple」· Paint「Camellia」· Creative Blush Sunrise

#452738

Rose Purple · DarkSlateGray · Raspberry

HEX
#452738
RGB
rgb(69, 39, 56)
HSL
hsl(326, 28%, 21%)
HSB
hsb(326, 43%, 27%)
CMYK
cmyk(0%, 43%, 19%, 73%)
Oklch
oklch(31.7% 0.052 345.4)

Traditional「Rose Purple」· Paint「Raspberry」· Creative Blush Sunrise

#781C40

Dark Violet · Brown · Camellia

HEX
#781C40
RGB
rgb(120, 28, 64)
HSL
hsl(337, 62%, 29%)
HSB
hsb(337, 77%, 47%)
CMYK
cmyk(0%, 77%, 47%, 53%)
Oklch
oklch(39.0% 0.129 1.7)

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

#961A33

Vermilion · Brown · Wine Red

HEX
#961A33
RGB
rgb(150, 26, 51)
HSL
hsl(348, 70%, 35%)
HSB
hsb(348, 83%, 59%)
CMYK
cmyk(0%, 83%, 66%, 41%)
Oklch
oklch(44.1% 0.158 16.3)

Traditional「Vermilion」· Paint「Wine Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D1E8E3
E7D0D5

Analogous

D0E7D6
D1E8E3
D0E0E7

Triadic

D1E8E3
E2D0E7
E7E2D0

Split-Comp.

D1E8E3
E7D0E0
E7D6D0

Tetradic

D1E8E3
D6D0E7
E7D0D5
E0E7D0

Contrast Matrix WCAG 2.1 Contrast

D1E8E3
7D546B
452738
781C40
961A33
—
4.9
AA
10.2
AAA
8.0
AAA
6.6
AA
4.9
AA
—
2.1
Fail
1.6
Fail
1.3
Fail
10.2
AAA
2.1
Fail
—
1.3
Fail
1.6
Fail
8.0
AAA
1.6
Fail
1.3
Fail
—
1.2
Fail
6.6
AA
1.3
Fail
1.6
Fail
1.2
Fail
—
White BG
1.3Fail
6.3AA
13.1AAA
10.3AAA
8.4AAA
Black BG
16.4AAA
3.4AA Large
1.6Fail
2.0Fail
2.5Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

DBDBE4
6B6B65
383834
504F37
605F2D

Deuteranopia

DAD8E4
6E7164
3A3C33
565C35
68712B

Tritanopia

D2E5E5
7B6160
443130
73302F
902827

Achromatopsia

E1E1E1
636363
323232
3C3C3C
424242

Shades & Tints Shades & Tints

#D1E8E3

Dark
Light

#7D546B

Dark
Light

#452738

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d1e8e3;
  --color-2: #7d546b;
  --color-3: #452738;
  --color-4: #781c40;
  --color-5: #961a33;
}

SCSS

$color-1: #d1e8e3;
$color-2: #7d546b;
$color-3: #452738;
$color-4: #781c40;
$color-5: #961a33;

TAILWIND

colors: {
  'brand-1': '#d1e8e3',
  'brand-2': '#7d546b',
  'brand-3': '#452738',
  'brand-4': '#781c40',
  'brand-5': '#961a33',
}

RGB Array

[209, 232, 227], [125, 84, 107], [69, 39, 56], [120, 28, 64], [150, 26, 51]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D1E8E3, #7D546B, #452738, #781C40, #961A33 is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #d1e8e3; --color-2: #7d546b; --color-3: #452738; --color-4: #781c40; --color-5: #961a33. 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. 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