← Back to Editor

#1D2124 · #E13E1B · #FF553E · #F27875 · #BEA489

warm

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

#1D2124

Slate Blue · Black · Deep Sea Blue

HEX
#1D2124
RGB
rgb(29, 33, 36)
HSL
hsl(206, 11%, 13%)
HSB
hsb(206, 19%, 14%)
CMYK
cmyk(19%, 8%, 0%, 86%)
Oklch
oklch(24.5% 0.008 240.2)

Traditional「Slate Blue」· Paint「Deep Sea Blue」· Creative Blush Sunrise

#E13E1B

Vermilion · OrangeRed · Passion Red

HEX
#E13E1B
RGB
rgb(225, 62, 27)
HSL
hsl(11, 79%, 49%)
HSB
hsb(11, 88%, 88%)
CMYK
cmyk(0%, 72%, 88%, 12%)
Oklch
oklch(60.4% 0.205 33.3)

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

#FF553E

Peach Pink · Tomato · Coral Red

HEX
#FF553E
RGB
rgb(255, 85, 62)
HSL
hsl(7, 100%, 62%)
HSB
hsb(7, 76%, 100%)
CMYK
cmyk(0%, 67%, 76%, 0%)
Oklch
oklch(67.9% 0.210 30.8)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#F27875

Peach Pink · Salmon · Coral Red

HEX
#F27875
RGB
rgb(242, 120, 117)
HSL
hsl(1, 83%, 70%)
HSB
hsb(1, 52%, 95%)
CMYK
cmyk(0%, 50%, 52%, 5%)
Oklch
oklch(71.3% 0.151 23.0)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#BEA489

Ginger · Tan · Warm Sun

HEX
#BEA489
RGB
rgb(190, 164, 137)
HSL
hsl(31, 29%, 64%)
HSB
hsb(31, 28%, 75%)
CMYK
cmyk(0%, 14%, 28%, 25%)
Oklch
oklch(73.5% 0.048 68.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

1D2124
25211E

Analogous

1E2524
1D2124
1E1E25

Triadic

1D2124
251E22
22251E

Split-Comp.

1D2124
251E1E
25241E

Tetradic

1D2124
241E25
25211E
1E251E

Contrast Matrix WCAG 2.1 Contrast

1D2124
E13E1B
FF553E
F27875
BEA489
—
3.8
AA Large
5.1
AA
6.0
AA
6.8
AA
3.8
AA Large
—
1.3
Fail
1.6
Fail
1.8
Fail
5.1
AA
1.3
Fail
—
1.2
Fail
1.3
Fail
6.0
AA
1.6
Fail
1.2
Fail
—
1.1
Fail
6.8
AA
1.8
Fail
1.3
Fail
1.1
Fail
—
White BG
16.2AAA
4.3AA Large
3.2AA Large
2.7Fail
2.4Fail
Black BG
1.3Fail
4.9AA
6.6AA
7.7AAA
8.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

1F1F23
9A9923
B5B444
BDBC76
B3B390

Deuteranopia

1F1E23
A4B026
BFCC45
C4CD76
B4B691

Tritanopia

1D2323
D92A2C
F74849
EC7676
BD9596

Achromatopsia

202020
6B6B6B
858585
9C9C9C
A9A9A9

Shades & Tints Shades & Tints

#1D2124

Dark
Light

#E13E1B

Dark
Light

#FF553E

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #1d2124;
  --color-2: #e13e1b;
  --color-3: #ff553e;
  --color-4: #f27875;
  --color-5: #bea489;
}

SCSS

$color-1: #1d2124;
$color-2: #e13e1b;
$color-3: #ff553e;
$color-4: #f27875;
$color-5: #bea489;

TAILWIND

colors: {
  'brand-1': '#1d2124',
  'brand-2': '#e13e1b',
  'brand-3': '#ff553e',
  'brand-4': '#f27875',
  'brand-5': '#bea489',
}

RGB Array

[29, 33, 36], [225, 62, 27], [255, 85, 62], [242, 120, 117], [190, 164, 137]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This warm-style palette of #1D2124, #E13E1B, #FF553E, #F27875, #BEA489 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: #1d2124; --color-2: #e13e1b; --color-3: #ff553e; --color-4: #f27875; --color-5: #bea489. 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