← Back to Editor

#DC5043 · #42231E · #63653D · #7DA25D · #D9B459

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

#DC5043

Vermilion · Tomato · Passion Red

HEX
#DC5043
RGB
rgb(220, 80, 67)
HSL
hsl(5, 69%, 56%)
HSB
hsb(5, 70%, 86%)
CMYK
cmyk(0%, 64%, 70%, 14%)
Oklch
oklch(61.8% 0.178 28.6)

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

#42231E

Crimson · DarkSlateGray · Deep Berry

HEX
#42231E
RGB
rgb(66, 35, 30)
HSL
hsl(8, 38%, 19%)
HSB
hsb(8, 55%, 26%)
CMYK
cmyk(0%, 47%, 55%, 74%)
Oklch
oklch(29.6% 0.049 30.0)

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

#63653D

Autumn Sage · DarkOliveGreen · Honey Gold

HEX
#63653D
RGB
rgb(99, 101, 61)
HSL
hsl(63, 25%, 32%)
HSB
hsb(63, 40%, 40%)
CMYK
cmyk(2%, 0%, 40%, 60%)
Oklch
oklch(49.5% 0.059 110.8)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#7DA25D

Celadon · Gray · Olive Green

HEX
#7DA25D
RGB
rgb(125, 162, 93)
HSL
hsl(92, 27%, 50%)
HSB
hsb(92, 43%, 64%)
CMYK
cmyk(23%, 0%, 43%, 36%)
Oklch
oklch(66.8% 0.104 131.7)

Traditional「Celadon」· Paint「Olive Green」· Creative Blush Sunrise

#D9B459

Ginger · SandyBrown · Sunflower

HEX
#D9B459
RGB
rgb(217, 180, 89)
HSL
hsl(43, 63%, 60%)
HSB
hsb(43, 59%, 85%)
CMYK
cmyk(0%, 17%, 59%, 15%)
Oklch
oklch(78.5% 0.118 87.3)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

DC5043
41CFDC

Analogous

DC4182
DC5043
DC9C41

Triadic

DC5043
41DC4E
4E41DC

Split-Comp.

DC5043
41DC9C
4182DC

Tetradic

DC5043
82DC41
41CFDC
9C41DC

Contrast Matrix WCAG 2.1 Contrast

DC5043
42231E
63653D
7DA25D
D9B459
—
3.5
AA Large
1.5
Fail
1.4
Fail
2.0
Fail
3.5
AA Large
—
2.3
Fail
4.8
AA
7.1
AAA
1.5
Fail
2.3
Fail
—
2.1
Fail
3.1
AA Large
1.4
Fail
4.8
AA
2.1
Fail
—
1.5
Fail
2.0
Fail
7.1
AAA
3.1
AA Large
1.5
Fail
—
White BG
4.0AA Large
14.1AAA
6.1AA
2.9Fail
2.0Fail
Black BG
5.3AA
1.5Fail
3.5AA Large
7.2AAA
10.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

9F9E46
35341F
646447
8D8D6E
C9C96F

Deuteranopia

A8B247
363920
646449
8B8872
CBCE74

Tritanopia

D54949
402020
634E50
7F7B7E
D78084

Achromatopsia

787878
2C2C2C
606060
8F8F8F
B5B5B5

Shades & Tints Shades & Tints

#DC5043

Dark
Light

#42231E

Dark
Light

#63653D

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #dc5043;
  --color-2: #42231e;
  --color-3: #63653d;
  --color-4: #7da25d;
  --color-5: #d9b459;
}

SCSS

$color-1: #dc5043;
$color-2: #42231e;
$color-3: #63653d;
$color-4: #7da25d;
$color-5: #d9b459;

TAILWIND

colors: {
  'brand-1': '#dc5043',
  'brand-2': '#42231e',
  'brand-3': '#63653d',
  'brand-4': '#7da25d',
  'brand-5': '#d9b459',
}

RGB Array

[220, 80, 67], [66, 35, 30], [99, 101, 61], [125, 162, 93], [217, 180, 89]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This warm-style palette of #DC5043, #42231E, #63653D, #7DA25D, #D9B459 is ideal for: 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: #dc5043; --color-2: #42231e; --color-3: #63653d; --color-4: #7da25d; --color-5: #d9b459. 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 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