← Back to Editor

#E5C545 · #E5CF6B · #445B12 · #250215 · #BD3B07

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

#E5C545

Ginger · SandyBrown · Sunflower

HEX
#E5C545
RGB
rgb(229, 197, 69)
HSL
hsl(48, 75%, 58%)
HSB
hsb(48, 70%, 90%)
CMYK
cmyk(0%, 14%, 70%, 10%)
Oklch
oklch(82.9% 0.146 94.8)

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

#E5CF6B

Ginger · BurlyWood · Sunflower

HEX
#E5CF6B
RGB
rgb(229, 207, 107)
HSL
hsl(49, 70%, 66%)
HSB
hsb(49, 53%, 90%)
CMYK
cmyk(0%, 10%, 53%, 10%)
Oklch
oklch(85.3% 0.123 97.2)

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

#445B12

Grass Green · DarkOliveGreen · Forest Green

HEX
#445B12
RGB
rgb(68, 91, 18)
HSL
hsl(79, 67%, 21%)
HSB
hsb(79, 80%, 36%)
CMYK
cmyk(25%, 0%, 80%, 64%)
Oklch
oklch(43.7% 0.100 125.9)

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

#250215

Rose Purple · Black · Raspberry

HEX
#250215
RGB
rgb(37, 2, 21)
HSL
hsl(327, 90%, 8%)
HSB
hsb(327, 95%, 15%)
CMYK
cmyk(0%, 95%, 43%, 85%)
Oklch
oklch(17.9% 0.067 350.7)

Traditional「Rose Purple」· Paint「Raspberry」· Creative Blush Sunrise

#BD3B07

Tangerine · FireBrick · Amber Brown

HEX
#BD3B07
RGB
rgb(189, 59, 7)
HSL
hsl(17, 93%, 38%)
HSB
hsb(17, 96%, 74%)
CMYK
cmyk(0%, 69%, 96%, 26%)
Oklch
oklch(53.8% 0.174 37.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E5C545
4464E4

Analogous

E47444
E5C545
B4E444

Triadic

E5C545
44E4C4
C444E4

Split-Comp.

E5C545
44B4E4
7444E4

Tetradic

E5C545
44E474
4464E4
E444B4

Contrast Matrix WCAG 2.1 Contrast

E5C545
E5CF6B
445B12
250215
BD3B07
—
1.1
Fail
4.5
AA
11.3
AAA
3.3
AA Large
1.1
Fail
—
4.9
AA
12.3
AAA
3.6
AA Large
4.5
AA
4.9
AA
—
2.5
Fail
1.4
Fail
11.3
AAA
12.3
AAA
2.5
Fail
—
3.5
AA Large
3.3
AA Large
3.6
AA Large
1.4
Fail
3.5
AA Large
—
White BG
1.7Fail
1.6Fail
7.6AAA
19.1AAA
5.5AA
Black BG
12.4AAA
13.5AAA
2.8Fail
1.1Fail
3.8AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

D7D764
DBDB83
4E4E24
161610
858414

Deuteranopia

D9DB6B
DDDE89
4D4B28
181B0F
8C9617

Tritanopia

E37C82
E4969B
453235
230D0C
B61E20

Achromatopsia

C0C0C0
CACACA
4C4C4C
0F0F0F
5C5C5C

Shades & Tints Shades & Tints

#E5C545

Dark
Light

#E5CF6B

Dark
Light

#445B12

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e5c545;
  --color-2: #e5cf6b;
  --color-3: #445b12;
  --color-4: #250215;
  --color-5: #bd3b07;
}

SCSS

$color-1: #e5c545;
$color-2: #e5cf6b;
$color-3: #445b12;
$color-4: #250215;
$color-5: #bd3b07;

TAILWIND

colors: {
  'brand-1': '#e5c545',
  'brand-2': '#e5cf6b',
  'brand-3': '#445b12',
  'brand-4': '#250215',
  'brand-5': '#bd3b07',
}

RGB Array

[229, 197, 69], [229, 207, 107], [68, 91, 18], [37, 2, 21], [189, 59, 7]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E5C545, #E5CF6B, #445B12, #250215, #BD3B07 is ideal for: social media posters, mobile apps, e-commerce promos, tech websites, dark mode UIs, game UIs, 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: #e5c545; --color-2: #e5cf6b; --color-3: #445b12; --color-4: #250215; --color-5: #bd3b07. 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?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. 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