← Back to Editor

#E6A401 · #C53A02 · #8B221F · #54012C · #017381

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarmCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial App

Color Details Color Details

#E6A401

Ochre · Orange · Honey Gold

HEX
#E6A401
RGB
rgb(230, 164, 1)
HSL
hsl(43, 99%, 45%)
HSB
hsb(43, 100%, 90%)
CMYK
cmyk(0%, 29%, 100%, 10%)
Oklch
oklch(76.2% 0.158 79.6)

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

#C53A02

Tangerine · FireBrick · Amber Brown

HEX
#C53A02
RGB
rgb(197, 58, 2)
HSL
hsl(17, 98%, 39%)
HSB
hsb(17, 99%, 77%)
CMYK
cmyk(0%, 71%, 99%, 23%)
Oklch
oklch(55.0% 0.183 37.0)

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

#8B221F

Vermilion · Brown · Wine Red

HEX
#8B221F
RGB
rgb(139, 34, 31)
HSL
hsl(2, 64%, 33%)
HSB
hsb(2, 78%, 55%)
CMYK
cmyk(0%, 76%, 78%, 45%)
Oklch
oklch(42.4% 0.141 26.9)

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

#54012C

Rose Purple · Maroon · Raspberry

HEX
#54012C
RGB
rgb(84, 1, 44)
HSL
hsl(329, 98%, 17%)
HSB
hsb(329, 99%, 33%)
CMYK
cmyk(0%, 99%, 48%, 67%)
Oklch
oklch(29.1% 0.117 357.3)

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

#017381

Lake Blue · Teal · Peacock Green

HEX
#017381
RGB
rgb(1, 115, 129)
HSL
hsl(187, 98%, 25%)
HSB
hsb(187, 99%, 51%)
CMYK
cmyk(99%, 11%, 0%, 49%)
Oklch
oklch(50.9% 0.088 209.5)

Traditional「Lake Blue」· Paint「Peacock Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E6A401
0142E4

Analogous

E43201
E6A401
B3E401

Triadic

E6A401
01E4A4
A401E4

Split-Comp.

E6A401
01B3E4
3201E4

Tetradic

E6A401
01E432
0142E4
E401B3

Contrast Matrix WCAG 2.1 Contrast

E6A401
C53A02
8B221F
54012C
017381
—
2.4
Fail
4.1
AA Large
6.8
AA
2.6
Fail
2.4
Fail
—
1.7
Fail
2.8
Fail
1.1
Fail
4.1
AA Large
1.7
Fail
—
1.7
Fail
1.6
Fail
6.8
AA
2.8
Fail
1.7
Fail
—
2.7
Fail
2.6
Fail
1.1
Fail
1.6
Fail
2.7
Fail
—
White BG
2.2Fail
5.3AA
8.9AAA
14.8AAA
5.6AA
Black BG
9.7AAA
4.0AA Large
2.3Fail
1.4Fail
3.8AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

C9C928
898810
5E5D20
302F22
32337E

Deuteranopia

CDD232
919B13
646C20
353B1F
2C237D

Tritanopia

E3484E
BE1A1D
862020
501918
077B7A

Achromatopsia

A5A5A5
5D5D5D
414141
1F1F1F
535353

Shades & Tints Shades & Tints

#E6A401

Dark
Light

#C53A02

Dark
Light

#8B221F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e6a401;
  --color-2: #c53a02;
  --color-3: #8b221f;
  --color-4: #54012c;
  --color-5: #017381;
}

SCSS

$color-1: #e6a401;
$color-2: #c53a02;
$color-3: #8b221f;
$color-4: #54012c;
$color-5: #017381;

TAILWIND

colors: {
  'brand-1': '#e6a401',
  'brand-2': '#c53a02',
  'brand-3': '#8b221f',
  'brand-4': '#54012c',
  'brand-5': '#017381',
}

RGB Array

[230, 164, 1], [197, 58, 2], [139, 34, 31], [84, 1, 44], [1, 115, 129]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E6A401, #C53A02, #8B221F, #54012C, #017381 is ideal for: social media posters, mobile apps, e-commerce promos, tech websites, dark mode UIs, game UIs. Vivid colors effectively attract user attention. 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: #e6a401; --color-2: #c53a02; --color-3: #8b221f; --color-4: #54012c; --color-5: #017381. 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. 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