← Back to Editor

#DE4F61 · #EABA89 · #7EAA91 · #344051 · #653C88

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

#DE4F61

Vermilion · Tomato · Passion Red

HEX
#DE4F61
RGB
rgb(222, 79, 97)
HSL
hsl(352, 68%, 59%)
HSB
hsb(352, 64%, 87%)
CMYK
cmyk(0%, 64%, 56%, 13%)
Oklch
oklch(62.6% 0.178 16.6)

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

#EABA89

Goose Yellow · BurlyWood · Warm Sun

HEX
#EABA89
RGB
rgb(234, 186, 137)
HSL
hsl(30, 70%, 73%)
HSB
hsb(30, 41%, 92%)
CMYK
cmyk(0%, 21%, 41%, 8%)
Oklch
oklch(82.1% 0.085 66.8)

Traditional「Goose Yellow」· Paint「Warm Sun」· Creative Honey Glow

#7EAA91

Celadon · DarkSeaGreen · Olive Green

HEX
#7EAA91
RGB
rgb(126, 170, 145)
HSL
hsl(146, 21%, 58%)
HSB
hsb(146, 26%, 67%)
CMYK
cmyk(26%, 0%, 15%, 33%)
Oklch
oklch(69.9% 0.060 159.5)

Traditional「Celadon」· Paint「Olive Green」· Creative Blush Sunrise

#344051

Indigo · DarkSlateGray · Prussian Blue

HEX
#344051
RGB
rgb(52, 64, 81)
HSL
hsl(215, 22%, 26%)
HSB
hsb(215, 36%, 32%)
CMYK
cmyk(36%, 21%, 0%, 68%)
Oklch
oklch(36.8% 0.033 257.1)

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

#653C88

Dark Plum · DarkSlateBlue · Eggplant

HEX
#653C88
RGB
rgb(101, 60, 136)
HSL
hsl(272, 39%, 38%)
HSB
hsb(272, 56%, 53%)
CMYK
cmyk(26%, 56%, 0%, 47%)
Oklch
oklch(44.1% 0.126 306.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

DE4F61
4FDECB

Analogous

DE4FA9
DE4F61
DE834F

Triadic

DE4F61
62DE4F
4F62DE

Split-Comp.

DE4F61
4FDE83
4FA9DE

Tetradic

DE4F61
A9DE4F
4FDECB
834FDE

Contrast Matrix WCAG 2.1 Contrast

DE4F61
EABA89
7EAA91
344051
653C88
—
2.2
Fail
1.5
Fail
2.7
Fail
2.1
Fail
2.2
Fail
—
1.5
Fail
5.9
AA
4.7
AA
1.5
Fail
1.5
Fail
—
4.0
AA Large
3.1
AA Large
2.7
Fail
5.9
AA
4.0
AA Large
—
1.3
Fail
2.1
Fail
4.7
AA
3.1
AA Large
1.3
Fail
—
White BG
3.9AA Large
1.8Fail
2.6Fail
10.5AAA
8.2AAA
Black BG
5.4AA
11.9AAA
8.0AAA
2.0Fail
2.6Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

A09F5D
D5D595
919197
39394D
535376

Deuteranopia

A8B35C
D8DC98
8F8B99
39384C
565971

Tritanopia

D75958
E89EA0
809C9D
354A49
636764

Achromatopsia

7C7C7C
C3C3C3
9A9A9A
3E3E3E
515151

Shades & Tints Shades & Tints

#DE4F61

Dark
Light

#EABA89

Dark
Light

#7EAA91

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #de4f61;
  --color-2: #eaba89;
  --color-3: #7eaa91;
  --color-4: #344051;
  --color-5: #653c88;
}

SCSS

$color-1: #de4f61;
$color-2: #eaba89;
$color-3: #7eaa91;
$color-4: #344051;
$color-5: #653c88;

TAILWIND

colors: {
  'brand-1': '#de4f61',
  'brand-2': '#eaba89',
  'brand-3': '#7eaa91',
  'brand-4': '#344051',
  'brand-5': '#653c88',
}

RGB Array

[222, 79, 97], [234, 186, 137], [126, 170, 145], [52, 64, 81], [101, 60, 136]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #DE4F61, #EABA89, #7EAA91, #344051, #653C88 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: #de4f61; --color-2: #eaba89; --color-3: #7eaa91; --color-4: #344051; --color-5: #653c88. 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