← Back to Editor

#5F4C34 · #CBE2B6 · #D4CB62 · #D1AB2E · #D64F24

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

#5F4C34

Ochre · DarkOliveGreen · Amber Brown

HEX
#5F4C34
RGB
rgb(95, 76, 52)
HSL
hsl(33, 29%, 29%)
HSB
hsb(33, 45%, 37%)
CMYK
cmyk(0%, 20%, 45%, 63%)
Oklch
oklch(43.0% 0.045 72.7)

Traditional「Ochre」· Paint「Amber Brown」· Creative Blush Sunrise

#CBE2B6

Celadon · LightGray · Apple Green

HEX
#CBE2B6
RGB
rgb(203, 226, 182)
HSL
hsl(91, 43%, 80%)
HSB
hsb(91, 19%, 89%)
CMYK
cmyk(10%, 0%, 19%, 11%)
Oklch
oklch(88.4% 0.064 130.1)

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

#D4CB62

Fresh Green · BurlyWood · Sunflower

HEX
#D4CB62
RGB
rgb(212, 203, 98)
HSL
hsl(55, 57%, 61%)
HSB
hsb(55, 54%, 83%)
CMYK
cmyk(0%, 4%, 54%, 17%)
Oklch
oklch(82.8% 0.127 104.4)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

#D1AB2E

Ochre · GoldenRod · Honey Gold

HEX
#D1AB2E
RGB
rgb(209, 171, 46)
HSL
hsl(46, 64%, 50%)
HSB
hsb(46, 78%, 82%)
CMYK
cmyk(0%, 18%, 78%, 18%)
Oklch
oklch(75.5% 0.141 90.8)

Traditional「Ochre」· Paint「Honey Gold」· Creative Blush Sunrise

#D64F24

Vermilion · Chocolate · Passion Red

HEX
#D64F24
RGB
rgb(214, 79, 36)
HSL
hsl(14, 71%, 49%)
HSB
hsb(14, 83%, 84%)
CMYK
cmyk(0%, 63%, 83%, 16%)
Oklch
oklch(60.4% 0.179 37.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

5F4C34
35485F

Analogous

5F3735
5F4C34
5D5F35

Triadic

5F4C34
355F4C
4C355F

Split-Comp.

5F4C34
355D5F
37355F

Tetradic

5F4C34
355F37
35485F
5F355D

Contrast Matrix WCAG 2.1 Contrast

5F4C34
CBE2B6
D4CB62
D1AB2E
D64F24
—
5.9
AA
4.9
AA
3.7
AA Large
1.9
Fail
5.9
AA
—
1.2
Fail
1.6
Fail
3.0
AA Large
4.9
AA
1.2
Fail
—
1.3
Fail
2.5
Fail
3.7
AA Large
1.6
Fail
1.3
Fail
—
1.9
Fail
1.9
Fail
3.0
AA Large
2.5
Fail
1.9
Fail
—
White BG
8.2AAA
1.4Fail
1.7Fail
2.2Fail
4.2AA Large
Black BG
2.6Fail
15.1AAA
12.5AAA
9.6AAA
5.0AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

57573A
D5D5C1
D0D07B
C1C04C
9C9A2E

Deuteranopia

58593B
D4D2C3
D1D182
C3C654
A3AD31

Tritanopia

5E3E3F
CCC9CB
D48F94
CF6469
CF3738

Achromatopsia

4F4F4F
D6D6D6
C2C2C2
A8A8A8
727272

Shades & Tints Shades & Tints

#5F4C34

Dark
Light

#CBE2B6

Dark
Light

#D4CB62

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #5f4c34;
  --color-2: #cbe2b6;
  --color-3: #d4cb62;
  --color-4: #d1ab2e;
  --color-5: #d64f24;
}

SCSS

$color-1: #5f4c34;
$color-2: #cbe2b6;
$color-3: #d4cb62;
$color-4: #d1ab2e;
$color-5: #d64f24;

TAILWIND

colors: {
  'brand-1': '#5f4c34',
  'brand-2': '#cbe2b6',
  'brand-3': '#d4cb62',
  'brand-4': '#d1ab2e',
  'brand-5': '#d64f24',
}

RGB Array

[95, 76, 52], [203, 226, 182], [212, 203, 98], [209, 171, 46], [214, 79, 36]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This warm-style palette of #5F4C34, #CBE2B6, #D4CB62, #D1AB2E, #D64F24 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: #5f4c34; --color-2: #cbe2b6; --color-3: #d4cb62; --color-4: #d1ab2e; --color-5: #d64f24. 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