← Back to Editor

#D9C596 · #E6AB22 · #E67A0E · #DE2E1B · #403A2D

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarm

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#D9C596

Goose Yellow · BurlyWood · Sunflower

HEX
#D9C596
RGB
rgb(217, 197, 150)
HSL
hsl(42, 47%, 72%)
HSB
hsb(42, 31%, 85%)
CMYK
cmyk(0%, 9%, 31%, 15%)
Oklch
oklch(82.9% 0.066 87.6)

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

#E6AB22

Ginger · GoldenRod · Sunflower

HEX
#E6AB22
RGB
rgb(230, 171, 34)
HSL
hsl(42, 80%, 52%)
HSB
hsb(42, 85%, 90%)
CMYK
cmyk(0%, 26%, 85%, 10%)
Oklch
oklch(77.6% 0.152 82.1)

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

#E67A0E

Ochre · Chocolate · Amber Brown

HEX
#E67A0E
RGB
rgb(230, 122, 14)
HSL
hsl(30, 89%, 48%)
HSB
hsb(30, 94%, 90%)
CMYK
cmyk(0%, 47%, 94%, 10%)
Oklch
oklch(68.9% 0.166 55.6)

Traditional「Ochre」· Paint「Amber Brown」· Creative Blush Sunrise

#DE2E1B

Vermilion · Crimson · Passion Red

HEX
#DE2E1B
RGB
rgb(222, 46, 27)
HSL
hsl(6, 78%, 49%)
HSB
hsb(6, 88%, 87%)
CMYK
cmyk(0%, 79%, 88%, 13%)
Oklch
oklch(58.5% 0.213 30.4)

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

#403A2D

Ochre · DarkSlateGray · Amber Gold

HEX
#403A2D
RGB
rgb(64, 58, 45)
HSL
hsl(41, 17%, 21%)
HSB
hsb(41, 30%, 25%)
CMYK
cmyk(0%, 9%, 30%, 75%)
Oklch
oklch(35.1% 0.023 86.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D9C596
96AAD9

Analogous

D9A396
D9C596
CCD996

Triadic

D9C596
96D9C5
C596D9

Split-Comp.

D9C596
96CCD9
A396D9

Tetradic

D9C596
96D9A3
96AAD9
D996CC

Contrast Matrix WCAG 2.1 Contrast

D9C596
E6AB22
E67A0E
DE2E1B
403A2D
—
1.2
Fail
1.7
Fail
2.7
Fail
6.7
AA
1.2
Fail
—
1.4
Fail
2.3
Fail
5.5
AA
1.7
Fail
1.4
Fail
—
1.6
Fail
3.8
AA Large
2.7
Fail
2.3
Fail
1.6
Fail
—
2.4
Fail
6.7
AA
5.5
AA
3.8
AA Large
2.4
Fail
—
White BG
1.7Fail
2.1Fail
2.9Fail
4.7AA
11.3AAA
Black BG
12.4AAA
10.2AAA
7.2AAA
4.5AA
1.9Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

D0D0A1
CCCC43
B7B628
929020
3D3D30

Deuteranopia

D2D3A4
D0D44B
BEC62E
9CA921
3E3E31

Tritanopia

D8AAAC
E35D63
E13D41
D52324
403333

Achromatopsia

C6C6C6
ADADAD
8E8E8E
606060
3A3A3A

Shades & Tints Shades & Tints

#D9C596

Dark
Light

#E6AB22

Dark
Light

#E67A0E

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d9c596;
  --color-2: #e6ab22;
  --color-3: #e67a0e;
  --color-4: #de2e1b;
  --color-5: #403a2d;
}

SCSS

$color-1: #d9c596;
$color-2: #e6ab22;
$color-3: #e67a0e;
$color-4: #de2e1b;
$color-5: #403a2d;

TAILWIND

colors: {
  'brand-1': '#d9c596',
  'brand-2': '#e6ab22',
  'brand-3': '#e67a0e',
  'brand-4': '#de2e1b',
  'brand-5': '#403a2d',
}

RGB Array

[217, 197, 150], [230, 171, 34], [230, 122, 14], [222, 46, 27], [64, 58, 45]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D9C596, #E6AB22, #E67A0E, #DE2E1B, #403A2D is ideal for: social media posters, mobile apps, e-commerce promos, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #d9c596; --color-2: #e6ab22; --color-3: #e67a0e; --color-4: #de2e1b; --color-5: #403a2d. 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 food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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