← Back to Editor

#E35B66 · #BB9830 · #408B54 · #434983 · #654974

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 Library

Color Details Color Details

#E35B66

Peach Pink · Tomato · Coral Red

HEX
#E35B66
RGB
rgb(227, 91, 102)
HSL
hsl(355, 71%, 62%)
HSB
hsb(355, 60%, 89%)
CMYK
cmyk(0%, 60%, 55%, 11%)
Oklch
oklch(64.9% 0.169 18.3)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

#BB9830

Ochre · GoldenRod · Honey Gold

HEX
#BB9830
RGB
rgb(187, 152, 48)
HSL
hsl(45, 59%, 46%)
HSB
hsb(45, 74%, 73%)
CMYK
cmyk(0%, 19%, 74%, 27%)
Oklch
oklch(69.4% 0.125 89.5)

Traditional「Ochre」· Paint「Honey Gold」· Creative Blush Sunrise

#408B54

Celadon · SeaGreen · Forest Green

HEX
#408B54
RGB
rgb(64, 139, 84)
HSL
hsl(136, 37%, 40%)
HSB
hsb(136, 54%, 55%)
CMYK
cmyk(54%, 0%, 40%, 45%)
Oklch
oklch(57.4% 0.113 150.2)

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

#434983

Indigo · DarkSlateBlue · Prussian Blue

HEX
#434983
RGB
rgb(67, 73, 131)
HSL
hsl(234, 32%, 39%)
HSB
hsb(234, 49%, 51%)
CMYK
cmyk(49%, 44%, 0%, 49%)
Oklch
oklch(42.9% 0.096 277.1)

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

#654974

Dark Plum · DimGray · Eggplant

HEX
#654974
RGB
rgb(101, 73, 116)
HSL
hsl(279, 23%, 37%)
HSB
hsb(279, 37%, 45%)
CMYK
cmyk(13%, 37%, 0%, 55%)
Oklch
oklch(45.3% 0.076 313.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E35B66
59E3D7

Analogous

E359AA
E35B66
E39359

Triadic

E35B66
65E359
5965E3

Split-Comp.

E35B66
59E393
59AAE3

Tetradic

E35B66
AAE359
59E3D7
9359E3

Contrast Matrix WCAG 2.1 Contrast

E35B66
BB9830
408B54
434983
654974
—
1.3
Fail
1.2
Fail
2.4
Fail
2.2
Fail
1.3
Fail
—
1.5
Fail
3.0
AA Large
2.8
Fail
1.2
Fail
1.5
Fail
—
2.0
Fail
1.8
Fail
2.4
Fail
3.0
AA Large
2.0
Fail
—
1.1
Fail
2.2
Fail
2.8
Fail
1.8
Fail
1.1
Fail
—
White BG
3.5AA Large
2.7Fail
4.2AA Large
8.3AAA
7.6AAA
Black BG
6.0AA
7.6AAA
5.0AA
2.5Fail
2.8Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

A8A763
ACAC49
606161
464675
59596A

Deuteranopia

B0BA63
AEB14F
5C5765
454572
5B5D67

Tritanopia

DC6161
B95D61
446C6E
436A67
646160

Achromatopsia

858585
979797
6E6E6E
4E4E4E
565656

Shades & Tints Shades & Tints

#E35B66

Dark
Light

#BB9830

Dark
Light

#408B54

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e35b66;
  --color-2: #bb9830;
  --color-3: #408b54;
  --color-4: #434983;
  --color-5: #654974;
}

SCSS

$color-1: #e35b66;
$color-2: #bb9830;
$color-3: #408b54;
$color-4: #434983;
$color-5: #654974;

TAILWIND

colors: {
  'brand-1': '#e35b66',
  'brand-2': '#bb9830',
  'brand-3': '#408b54',
  'brand-4': '#434983',
  'brand-5': '#654974',
}

RGB Array

[227, 91, 102], [187, 152, 48], [64, 139, 84], [67, 73, 131], [101, 73, 116]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E35B66, #BB9830, #408B54, #434983, #654974 is ideal for: corporate websites, product showcases, portfolios. 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: #e35b66; --color-2: #bb9830; --color-3: #408b54; --color-4: #434983; --color-5: #654974. 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. 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