← Back to Editor

#E3CC64 · #E38E64 · #E35656 · #4F3F3F · #2B2424

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#E3CC64

Ginger · BurlyWood · Sunflower

HEX
#E3CC64
RGB
rgb(227, 204, 100)
HSL
hsl(49, 69%, 64%)
HSB
hsb(49, 56%, 89%)
CMYK
cmyk(0%, 10%, 56%, 11%)
Oklch
oklch(84.4% 0.127 97.0)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#E38E64

Apricot · DarkSalmon · Warm Sun

HEX
#E38E64
RGB
rgb(227, 142, 100)
HSL
hsl(20, 69%, 64%)
HSB
hsb(20, 56%, 89%)
CMYK
cmyk(0%, 37%, 56%, 11%)
Oklch
oklch(72.6% 0.118 46.6)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#E35656

Peach Pink · Tomato · Coral Red

HEX
#E35656
RGB
rgb(227, 86, 86)
HSL
hsl(0, 72%, 61%)
HSB
hsb(0, 62%, 89%)
CMYK
cmyk(0%, 62%, 62%, 11%)
Oklch
oklch(64.0% 0.176 23.5)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#4F3F3F

Crimson · DarkSlateGray · Wine Red

HEX
#4F3F3F
RGB
rgb(79, 63, 63)
HSL
hsl(0, 11%, 28%)
HSB
hsb(0, 20%, 31%)
CMYK
cmyk(0%, 20%, 20%, 69%)
Oklch
oklch(38.5% 0.022 18.2)

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

#2B2424

Crimson · DarkSlateGray · Dark Stone

HEX
#2B2424
RGB
rgb(43, 36, 36)
HSL
hsl(0, 9%, 15%)
HSB
hsb(0, 16%, 17%)
CMYK
cmyk(0%, 16%, 16%, 83%)
Oklch
oklch(26.8% 0.011 17.8)

Traditional「Crimson」· Paint「Dark Stone」· Creative Midnight Shadow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E3CC64
647BE3

Analogous

E38C64
E3CC64
BAE364

Triadic

E3CC64
64E3CB
CB64E3

Split-Comp.

E3CC64
64BAE3
8C64E3

Tetradic

E3CC64
64E38C
647BE3
E364BA

Contrast Matrix WCAG 2.1 Contrast

E3CC64
E38E64
E35656
4F3F3F
2B2424
—
1.6
Fail
2.3
Fail
6.2
AA
9.5
AAA
1.6
Fail
—
1.5
Fail
3.9
AA Large
6.0
AA
2.3
Fail
1.5
Fail
—
2.7
Fail
4.2
AA Large
6.2
AA
3.9
AA Large
2.7
Fail
—
1.5
Fail
9.5
AAA
6.0
AA
4.2
AA Large
1.5
Fail
—
White BG
1.6Fail
2.5Fail
3.7AA Large
9.9AAA
15.2AAA
Black BG
13.1AAA
8.3AAA
5.7AA
2.1Fail
1.4Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

D9D97D
BEBD6E
A6A556
48483F
282824

Deuteranopia

DADC83
C3C971
AEB956
494A3F
282924

Tritanopia

E29195
DF7678
DC5656
4E3F3F
2B2424

Achromatopsia

C7C7C7
A3A3A3
808080
444444
262626

Shades & Tints Shades & Tints

#E3CC64

Dark
Light

#E38E64

Dark
Light

#E35656

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e3cc64;
  --color-2: #e38e64;
  --color-3: #e35656;
  --color-4: #4f3f3f;
  --color-5: #2b2424;
}

SCSS

$color-1: #e3cc64;
$color-2: #e38e64;
$color-3: #e35656;
$color-4: #4f3f3f;
$color-5: #2b2424;

TAILWIND

colors: {
  'brand-1': '#e3cc64',
  'brand-2': '#e38e64',
  'brand-3': '#e35656',
  'brand-4': '#4f3f3f',
  'brand-5': '#2b2424',
}

RGB Array

[227, 204, 100], [227, 142, 100], [227, 86, 86], [79, 63, 63], [43, 36, 36]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E3CC64, #E38E64, #E35656, #4F3F3F, #2B2424 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: #e3cc64; --color-2: #e38e64; --color-3: #e35656; --color-4: #4f3f3f; --color-5: #2b2424. 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