← Back to Editor

#2E1718 · #C81A25 · #DF9F00 · #E2E39A · #409A8E

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 AppData Visualization

Color Details Color Details

#2E1718

Crimson · Black · Deep Berry

HEX
#2E1718
RGB
rgb(46, 23, 24)
HSL
hsl(357, 33%, 14%)
HSB
hsb(357, 50%, 18%)
CMYK
cmyk(0%, 50%, 48%, 82%)
Oklch
oklch(23.7% 0.037 17.5)

Traditional「Crimson」· Paint「Deep Berry」· Creative Blush Sunrise

#C81A25

Vermilion · FireBrick · Passion Red

HEX
#C81A25
RGB
rgb(200, 26, 37)
HSL
hsl(356, 77%, 44%)
HSB
hsb(356, 87%, 78%)
CMYK
cmyk(0%, 87%, 82%, 22%)
Oklch
oklch(53.3% 0.204 25.6)

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

#DF9F00

Ochre · Orange · Honey Gold

HEX
#DF9F00
RGB
rgb(223, 159, 0)
HSL
hsl(43, 100%, 44%)
HSB
hsb(43, 100%, 87%)
CMYK
cmyk(0%, 29%, 100%, 13%)
Oklch
oklch(74.5% 0.154 79.7)

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

#E2E39A

Fresh Green · Khaki · Sunflower

HEX
#E2E39A
RGB
rgb(226, 227, 154)
HSL
hsl(61, 57%, 75%)
HSB
hsb(61, 32%, 89%)
CMYK
cmyk(0%, 0%, 32%, 11%)
Oklch
oklch(89.8% 0.093 108.8)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

#409A8E

Mineral Blue · CadetBlue · Mint Ice

HEX
#409A8E
RGB
rgb(64, 154, 142)
HSL
hsl(172, 41%, 43%)
HSB
hsb(172, 58%, 60%)
CMYK
cmyk(58%, 0%, 8%, 40%)
Oklch
oklch(62.9% 0.088 183.4)

Traditional「Mineral Blue」· Paint「Mint Ice」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

2E1718
182F2E

Analogous

2F1825
2E1718
2F2318

Triadic

2E1718
192F18
18192F

Split-Comp.

2E1718
182F23
18252F

Tetradic

2E1718
252F18
182F2E
23182F

Contrast Matrix WCAG 2.1 Contrast

2E1718
C81A25
DF9F00
E2E39A
409A8E
—
2.9
Fail
7.3
AAA
12.5
AAA
5.0
AA
2.9
Fail
—
2.5
Fail
4.3
AA Large
1.7
Fail
7.3
AAA
2.5
Fail
—
1.7
Fail
1.5
Fail
12.5
AAA
4.3
AA Large
1.7
Fail
—
2.5
Fail
5.0
AA
1.7
Fail
1.5
Fail
2.5
Fail
—
White BG
16.8AAA
5.8AA
2.3Fail
1.3Fail
3.4AA Large
Black BG
1.3Fail
3.6AA Large
9.1AAA
15.7AAA
6.2AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

242418
7D7B22
C3C326
E2E2AC
676891

Deuteranopia

252718
879422
C7CC30
E2E2B0
625B92

Tritanopia

2D1818
BF2020
DC454C
E2BABD
459394

Achromatopsia

1E1E1E
4F4F4F
A0A0A0
DADADA
7E7E7E

Shades & Tints Shades & Tints

#2E1718

Dark
Light

#C81A25

Dark
Light

#DF9F00

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #2e1718;
  --color-2: #c81a25;
  --color-3: #df9f00;
  --color-4: #e2e39a;
  --color-5: #409a8e;
}

SCSS

$color-1: #2e1718;
$color-2: #c81a25;
$color-3: #df9f00;
$color-4: #e2e39a;
$color-5: #409a8e;

TAILWIND

colors: {
  'brand-1': '#2e1718',
  'brand-2': '#c81a25',
  'brand-3': '#df9f00',
  'brand-4': '#e2e39a',
  'brand-5': '#409a8e',
}

RGB Array

[46, 23, 24], [200, 26, 37], [223, 159, 0], [226, 227, 154], [64, 154, 142]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #2E1718, #C81A25, #DF9F00, #E2E39A, #409A8E 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: #2e1718; --color-2: #c81a25; --color-3: #df9f00; --color-4: #e2e39a; --color-5: #409a8e. 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