← Back to Editor

#2B222C · #603048 · #C7956D · #F2D974 · #481848

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

#2B222C

Dark Plum · DarkSlateGray · Dark Purple

HEX
#2B222C
RGB
rgb(43, 34, 44)
HSL
hsl(294, 13%, 15%)
HSB
hsb(294, 23%, 17%)
CMYK
cmyk(2%, 23%, 0%, 83%)
Oklch
oklch(26.7% 0.022 323.0)

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

#603048

Dark Violet · DarkSlateGray · Camellia

HEX
#603048
RGB
rgb(96, 48, 72)
HSL
hsl(330, 33%, 28%)
HSB
hsb(330, 50%, 38%)
CMYK
cmyk(0%, 50%, 25%, 62%)
Oklch
oklch(38.0% 0.076 350.0)

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

#C7956D

Tangerine · DarkSalmon · Warm Sun

HEX
#C7956D
RGB
rgb(199, 149, 109)
HSL
hsl(27, 45%, 60%)
HSB
hsb(27, 45%, 78%)
CMYK
cmyk(0%, 25%, 45%, 22%)
Oklch
oklch(70.8% 0.081 59.6)

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

#F2D974

Ginger · Khaki · Sunflower

HEX
#F2D974
RGB
rgb(242, 217, 116)
HSL
hsl(48, 83%, 70%)
HSB
hsb(48, 52%, 95%)
CMYK
cmyk(0%, 10%, 52%, 5%)
Oklch
oklch(88.6% 0.124 95.8)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#481848

Rose Purple · DarkSlateGray · Dark Purple

HEX
#481848
RGB
rgb(72, 24, 72)
HSL
hsl(300, 50%, 19%)
HSB
hsb(300, 67%, 28%)
CMYK
cmyk(0%, 67%, 0%, 72%)
Oklch
oklch(30.5% 0.099 327.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

2B222C
222B21

Analogous

25212B
2B222C
2B2127

Triadic

2B222C
2B2A21
212B2A

Split-Comp.

2B222C
272B21
212B25

Tetradic

2B222C
2B2521
222B21
21272B

Contrast Matrix WCAG 2.1 Contrast

2B222C
603048
C7956D
F2D974
481848
—
1.5
Fail
5.8
AA
10.9
AAA
1.1
Fail
1.5
Fail
—
3.9
AA Large
7.4
AAA
1.3
Fail
5.8
AA
3.9
AA Large
—
1.9
Fail
5.3
AA
10.9
AAA
7.4
AAA
1.9
Fail
—
10.0
AAA
1.1
Fail
1.3
Fail
5.3
AA
10.0
AAA
—
White BG
15.4AAA
10.4AAA
2.6Fail
1.4Fail
14.0AAA
Black BG
1.4Fail
2.0Fail
7.9AAA
15.0AAA
1.5Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

27272A
4B4B42
B1B177
E7E78C
33333C

Deuteranopia

282829
4E5241
B4B879
E9EA92
363A3A

Tritanopia

2B2827
5E3E3D
C47E80
F1A0A4
463331

Achromatopsia

262626
414141
9F9F9F
D5D5D5
2C2C2C

Shades & Tints Shades & Tints

#2B222C

Dark
Light

#603048

Dark
Light

#C7956D

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #2b222c;
  --color-2: #603048;
  --color-3: #c7956d;
  --color-4: #f2d974;
  --color-5: #481848;
}

SCSS

$color-1: #2b222c;
$color-2: #603048;
$color-3: #c7956d;
$color-4: #f2d974;
$color-5: #481848;

TAILWIND

colors: {
  'brand-1': '#2b222c',
  'brand-2': '#603048',
  'brand-3': '#c7956d',
  'brand-4': '#f2d974',
  'brand-5': '#481848',
}

RGB Array

[43, 34, 44], [96, 48, 72], [199, 149, 109], [242, 217, 116], [72, 24, 72]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This warm-style palette of #2B222C, #603048, #C7956D, #F2D974, #481848 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: #2b222c; --color-2: #603048; --color-3: #c7956d; --color-4: #f2d974; --color-5: #481848. 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