← Back to Editor

#E3D3A3 · #E3B93B · #E66E32 · #DB3D3D · #4A3F61

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

#E3D3A3

Goose Yellow · Wheat · Lemon Cream

HEX
#E3D3A3
RGB
rgb(227, 211, 163)
HSL
hsl(45, 53%, 76%)
HSB
hsb(45, 28%, 89%)
CMYK
cmyk(0%, 7%, 28%, 11%)
Oklch
oklch(86.8% 0.065 91.8)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#E3B93B

Ginger · GoldenRod · Sunflower

HEX
#E3B93B
RGB
rgb(227, 185, 59)
HSL
hsl(45, 75%, 56%)
HSB
hsb(45, 74%, 89%)
CMYK
cmyk(0%, 19%, 74%, 11%)
Oklch
oklch(80.2% 0.145 89.6)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

#E66E32

Tangerine · Chocolate · Warm Sun

HEX
#E66E32
RGB
rgb(230, 110, 50)
HSL
hsl(20, 78%, 55%)
HSB
hsb(20, 78%, 90%)
CMYK
cmyk(0%, 52%, 78%, 10%)
Oklch
oklch(67.2% 0.166 44.5)

Traditional「Tangerine」· Paint「Warm Sun」· Creative Blush Sunrise

#DB3D3D

Vermilion · Crimson · Passion Red

HEX
#DB3D3D
RGB
rgb(219, 61, 61)
HSL
hsl(0, 69%, 55%)
HSB
hsb(0, 72%, 86%)
CMYK
cmyk(0%, 72%, 72%, 14%)
Oklch
oklch(59.6% 0.195 25.4)

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

#4A3F61

Deep Indigo · DarkSlateGray · Prussian Blue

HEX
#4A3F61
RGB
rgb(74, 63, 97)
HSL
hsl(259, 21%, 31%)
HSB
hsb(259, 35%, 38%)
CMYK
cmyk(24%, 35%, 0%, 62%)
Oklch
oklch(39.4% 0.058 298.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E3D3A3
A1B2E2

Analogous

E2B2A1
E3D3A3
D2E2A1

Triadic

E3D3A3
A1E2D2
D2A1E2

Split-Comp.

E3D3A3
A1D2E2
B2A1E2

Tetradic

E3D3A3
A1E2B2
A1B2E2
E2A1D2

Contrast Matrix WCAG 2.1 Contrast

E3D3A3
E3B93B
E66E32
DB3D3D
4A3F61
—
1.3
Fail
2.1
Fail
3.0
Fail
6.5
AA
1.3
Fail
—
1.7
Fail
2.4
Fail
5.2
AA
2.1
Fail
1.7
Fail
—
1.4
Fail
3.1
AA Large
3.0
Fail
2.4
Fail
1.4
Fail
—
2.2
Fail
6.5
AA
5.2
AA
3.1
AA Large
2.2
Fail
—
White BG
1.5Fail
1.9Fail
3.2AA Large
4.4AA Large
9.7AAA
Black BG
14.1AAA
11.3AAA
6.6AA
4.7AA
2.2Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

DCDCAF
D1D059
B2B141
97953D
454559

Deuteranopia

DDDEB1
D3D661
B9C244
A0AC3D
464757

Tritanopia

E2B8BA
E17277
E04C4F
D33D3D
495251

Achromatopsia

D2D2D2
B7B7B7
8B8B8B
6C6C6C
464646

Shades & Tints Shades & Tints

#E3D3A3

Dark
Light

#E3B93B

Dark
Light

#E66E32

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e3d3a3;
  --color-2: #e3b93b;
  --color-3: #e66e32;
  --color-4: #db3d3d;
  --color-5: #4a3f61;
}

SCSS

$color-1: #e3d3a3;
$color-2: #e3b93b;
$color-3: #e66e32;
$color-4: #db3d3d;
$color-5: #4a3f61;

TAILWIND

colors: {
  'brand-1': '#e3d3a3',
  'brand-2': '#e3b93b',
  'brand-3': '#e66e32',
  'brand-4': '#db3d3d',
  'brand-5': '#4a3f61',
}

RGB Array

[227, 211, 163], [227, 185, 59], [230, 110, 50], [219, 61, 61], [74, 63, 97]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E3D3A3, #E3B93B, #E66E32, #DB3D3D, #4A3F61 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: #e3d3a3; --color-2: #e3b93b; --color-3: #e66e32; --color-4: #db3d3d; --color-5: #4a3f61. 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