← Back to Editor

#420919 · #E03A07 · #F28525 · #D4B17A · #80D99B

warm

A 5-color warm 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

#420919

Dark Violet · Maroon · Raspberry

HEX
#420919
RGB
rgb(66, 9, 25)
HSL
hsl(343, 76%, 15%)
HSB
hsb(343, 86%, 26%)
CMYK
cmyk(0%, 86%, 62%, 74%)
Oklch
oklch(25.3% 0.086 9.8)

Traditional「Dark Violet」· Paint「Raspberry」· Creative Blush Sunrise

#E03A07

Vermilion · OrangeRed · Passion Red

HEX
#E03A07
RGB
rgb(224, 58, 7)
HSL
hsl(14, 94%, 45%)
HSB
hsb(14, 97%, 88%)
CMYK
cmyk(0%, 74%, 97%, 12%)
Oklch
oklch(59.8% 0.209 34.6)

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

#F28525

Tangerine · GoldenRod · Warm Sun

HEX
#F28525
RGB
rgb(242, 133, 37)
HSL
hsl(28, 89%, 55%)
HSB
hsb(28, 85%, 95%)
CMYK
cmyk(0%, 45%, 85%, 5%)
Oklch
oklch(72.3% 0.166 55.5)

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

#D4B17A

Ginger · BurlyWood · Warm Sun

HEX
#D4B17A
RGB
rgb(212, 177, 122)
HSL
hsl(37, 51%, 65%)
HSB
hsb(37, 42%, 83%)
CMYK
cmyk(0%, 17%, 42%, 17%)
Oklch
oklch(77.9% 0.082 78.4)

Traditional「Ginger」· Paint「Warm Sun」· Creative Honey Glow

#80D99B

Emerald · LightGreen · Apple Green

HEX
#80D99B
RGB
rgb(128, 217, 155)
HSL
hsl(138, 54%, 68%)
HSB
hsb(138, 41%, 85%)
CMYK
cmyk(41%, 0%, 29%, 15%)
Oklch
oklch(81.3% 0.123 152.6)

Traditional「Emerald」· Paint「Apple Green」· Creative Mint Breeze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

420919
094333

Analogous

430937
420919
431609

Triadic

420919
1A4309
091A43

Split-Comp.

420919
094316
093743

Tetradic

420919
374309
094333
160943

Contrast Matrix WCAG 2.1 Contrast

420919
E03A07
F28525
D4B17A
80D99B
—
3.7
AA Large
6.3
AA
8.1
AAA
9.6
AAA
3.7
AA Large
—
1.7
Fail
2.2
Fail
2.6
Fail
6.3
AA
1.7
Fail
—
1.3
Fail
1.5
Fail
8.1
AAA
2.2
Fail
1.3
Fail
—
1.2
Fail
9.6
AAA
2.6
Fail
1.5
Fail
1.2
Fail
—
White BG
16.3AAA
4.4AA Large
2.6Fail
2.0Fail
1.7Fail
Black BG
1.3Fail
4.8AA
8.2AAA
10.4AAA
12.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

292915
989713
C3C23C
C5C587
A7A7AA

Deuteranopia

2D3114
A2AE16
C9D142
C7C98B
A19BAE

Tritanopia

3F1211
D81D1F
ED4F53
D29294
84B6B8

Achromatopsia

1C1C1C
666666
9B9B9B
B5B5B5
B7B7B7

Shades & Tints Shades & Tints

#420919

Dark
Light

#E03A07

Dark
Light

#F28525

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #420919;
  --color-2: #e03a07;
  --color-3: #f28525;
  --color-4: #d4b17a;
  --color-5: #80d99b;
}

SCSS

$color-1: #420919;
$color-2: #e03a07;
$color-3: #f28525;
$color-4: #d4b17a;
$color-5: #80d99b;

TAILWIND

colors: {
  'brand-1': '#420919',
  'brand-2': '#e03a07',
  'brand-3': '#f28525',
  'brand-4': '#d4b17a',
  'brand-5': '#80d99b',
}

RGB Array

[66, 9, 25], [224, 58, 7], [242, 133, 37], [212, 177, 122], [128, 217, 155]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This warm-style palette of #420919, #E03A07, #F28525, #D4B17A, #80D99B 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: #420919; --color-2: #e03a07; --color-3: #f28525; --color-4: #d4b17a; --color-5: #80d99b. 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 warm-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