← Back to Editor

#E0DFF2 · #A5A5D2 · #4C5D8A · #301A5E · #000512

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#E0DFF2

Wisteria · Lavender · Sky Blue

HEX
#E0DFF2
RGB
rgb(224, 223, 242)
HSL
hsl(243, 42%, 91%)
HSB
hsb(243, 8%, 95%)
CMYK
cmyk(7%, 8%, 0%, 5%)
Oklch
oklch(91.0% 0.026 288.3)

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

#A5A5D2

Wisteria · LightSteelBlue · Cobalt Blue

HEX
#A5A5D2
RGB
rgb(165, 165, 210)
HSL
hsl(240, 33%, 74%)
HSB
hsb(240, 21%, 82%)
CMYK
cmyk(21%, 21%, 0%, 18%)
Oklch
oklch(73.8% 0.065 284.7)

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

#4C5D8A

Indigo · DarkSlateBlue · Navy Blue

HEX
#4C5D8A
RGB
rgb(76, 93, 138)
HSL
hsl(224, 29%, 42%)
HSB
hsb(224, 45%, 54%)
CMYK
cmyk(45%, 33%, 0%, 46%)
Oklch
oklch(48.4% 0.076 267.7)

Traditional「Indigo」· Paint「Navy Blue」· Creative Blush Sunrise

#301A5E

Deep Indigo · MidnightBlue · Prussian Blue

HEX
#301A5E
RGB
rgb(48, 26, 94)
HSL
hsl(259, 57%, 24%)
HSB
hsb(259, 72%, 37%)
CMYK
cmyk(49%, 72%, 0%, 63%)
Oklch
oklch(29.2% 0.114 292.8)

Traditional「Deep Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

#000512

Indigo · Black · Deep Sea Blue

HEX
#000512
RGB
rgb(0, 5, 18)
HSL
hsl(223, 100%, 4%)
HSB
hsb(223, 100%, 7%)
CMYK
cmyk(100%, 72%, 0%, 93%)
Oklch
oklch(11.6% 0.037 253.8)

Traditional「Indigo」· Paint「Deep Sea Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E0DFF2
F1F2DE

Analogous

DEE7F2
E0DFF2
E9DEF2

Triadic

E0DFF2
F2DFDE
DEF2DF

Split-Comp.

E0DFF2
F2E9DE
E7F2DE

Tetradic

E0DFF2
F2DEE7
F1F2DE
DEF2E9

Contrast Matrix WCAG 2.1 Contrast

E0DFF2
A5A5D2
4C5D8A
301A5E
000512
—
1.8
Fail
4.9
AA
11.2
AAA
15.5
AAA
1.8
Fail
—
2.8
Fail
6.2
AA
8.6
AAA
4.9
AA
2.8
Fail
—
2.3
Fail
3.1
AA Large
11.2
AAA
6.2
AA
2.3
Fail
—
1.4
Fail
15.5
AAA
8.6
AAA
3.1
AA Large
1.4
Fail
—
White BG
1.3Fail
2.4Fail
6.5AA
14.6AAA
20.4AAA
Black BG
16.0AAA
8.9AAA
3.2AA Large
1.4Fail
1.0Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

E0E0ED
A5A5C7
53547F
26264E
02020F

Deuteranopia

E0E0EC
A5A5C5
52517D
28294A
02020E

Tritanopia

E0EAE9
A5BFBD
4D7775
2F413E
000C0C

Achromatopsia

E1E1E1
AAAAAA
5D5D5D
282828
050505

Shades & Tints Shades & Tints

#E0DFF2

Dark
Light

#A5A5D2

Dark
Light

#4C5D8A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e0dff2;
  --color-2: #a5a5d2;
  --color-3: #4c5d8a;
  --color-4: #301a5e;
  --color-5: #000512;
}

SCSS

$color-1: #e0dff2;
$color-2: #a5a5d2;
$color-3: #4c5d8a;
$color-4: #301a5e;
$color-5: #000512;

TAILWIND

colors: {
  'brand-1': '#e0dff2',
  'brand-2': '#a5a5d2',
  'brand-3': '#4c5d8a',
  'brand-4': '#301a5e',
  'brand-5': '#000512',
}

RGB Array

[224, 223, 242], [165, 165, 210], [76, 93, 138], [48, 26, 94], [0, 5, 18]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E0DFF2, #A5A5D2, #4C5D8A, #301A5E, #000512 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: #e0dff2; --color-2: #a5a5d2; --color-3: #4c5d8a; --color-4: #301a5e; --color-5: #000512. 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