← Back to Editor

#2B202E · #4A2935 · #853F39 · #F2A557 · #B33232

warm

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#2B202E

Dark Plum · DarkSlateGray · Dark Purple

HEX
#2B202E
RGB
rgb(43, 32, 46)
HSL
hsl(287, 18%, 15%)
HSB
hsb(287, 30%, 18%)
CMYK
cmyk(7%, 30%, 0%, 82%)
Oklch
oklch(26.3% 0.030 318.9)

Traditional「Dark Plum」· Paint「Dark Purple」· Creative Blush Sunrise

#4A2935

Dark Violet · DarkSlateGray · Raspberry

HEX
#4A2935
RGB
rgb(74, 41, 53)
HSL
hsl(338, 29%, 23%)
HSB
hsb(338, 45%, 29%)
CMYK
cmyk(0%, 45%, 28%, 71%)
Oklch
oklch(32.7% 0.052 357.1)

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

#853F39

Crimson · Sienna · Wine Red

HEX
#853F39
RGB
rgb(133, 63, 57)
HSL
hsl(5, 40%, 37%)
HSB
hsb(5, 57%, 52%)
CMYK
cmyk(0%, 53%, 57%, 48%)
Oklch
oklch(45.7% 0.097 26.6)

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

#F2A557

Ginger · SandyBrown · Warm Sun

HEX
#F2A557
RGB
rgb(242, 165, 87)
HSL
hsl(30, 86%, 65%)
HSB
hsb(30, 64%, 95%)
CMYK
cmyk(0%, 32%, 64%, 5%)
Oklch
oklch(78.2% 0.131 64.1)

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

#B33232

Crimson · Brown · Passion Red

HEX
#B33232
RGB
rgb(179, 50, 50)
HSL
hsl(0, 56%, 45%)
HSB
hsb(0, 72%, 70%)
CMYK
cmyk(0%, 72%, 72%, 30%)
Oklch
oklch(51.4% 0.166 25.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

2B202E
222D1F

Analogous

231F2D
2B202E
2D1F29

Triadic

2B202E
2D2A1F
1F2D2A

Split-Comp.

2B202E
292D1F
1F2D23

Tetradic

2B202E
2D231F
222D1F
1F292D

Contrast Matrix WCAG 2.1 Contrast

2B202E
4A2935
853F39
F2A557
B33232
—
1.2
Fail
2.1
Fail
7.6
AAA
2.5
Fail
1.2
Fail
—
1.7
Fail
6.2
AA
2.1
Fail
2.1
Fail
1.7
Fail
—
3.7
AA Large
1.2
Fail
7.6
AAA
6.2
AA
3.7
AA Large
—
3.0
AA Large
2.5
Fail
2.1
Fail
1.2
Fail
3.0
AA Large
—
White BG
15.6AAA
12.7AAA
7.6AAA
2.0Fail
6.1AA
Black BG
1.3Fail
1.7Fail
2.8Fail
10.3AAA
3.4AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

26262B
3C3B32
67663A
D1D06A
7B7A32

Deuteranopia

27282A
3E4031
6B703B
D5DB6E
838C32

Tritanopia

2A2827
48302F
823C3C
EE797C
AD3232

Achromatopsia

252525
343434
535353
B3B3B3
595959

Shades & Tints Shades & Tints

#2B202E

Dark
Light

#4A2935

Dark
Light

#853F39

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #2b202e;
  --color-2: #4a2935;
  --color-3: #853f39;
  --color-4: #f2a557;
  --color-5: #b33232;
}

SCSS

$color-1: #2b202e;
$color-2: #4a2935;
$color-3: #853f39;
$color-4: #f2a557;
$color-5: #b33232;

TAILWIND

colors: {
  'brand-1': '#2b202e',
  'brand-2': '#4a2935',
  'brand-3': '#853f39',
  'brand-4': '#f2a557',
  'brand-5': '#b33232',
}

RGB Array

[43, 32, 46], [74, 41, 53], [133, 63, 57], [242, 165, 87], [179, 50, 50]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This warm-style palette of #2B202E, #4A2935, #853F39, #F2A557, #B33232 is ideal for: tech websites, dark mode UIs, game UIs, infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #2b202e; --color-2: #4a2935; --color-3: #853f39; --color-4: #f2a557; --color-5: #b33232. 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 warm-style 5-color scheme is especially suited for tech, SaaS, healthcare, eco industries. 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