← Back to Editor

#322E23 · #D6462C · #B88A73 · #C4AC90 · #B1AD94

cool

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

#322E23

Ochre · DarkSlateGray · Amber Gold

HEX
#322E23
RGB
rgb(50, 46, 35)
HSL
hsl(44, 18%, 17%)
HSB
hsb(44, 30%, 20%)
CMYK
cmyk(0%, 8%, 30%, 80%)
Oklch
oklch(30.2% 0.020 90.4)

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

#D6462C

Vermilion · Chocolate · Passion Red

HEX
#D6462C
RGB
rgb(214, 70, 44)
HSL
hsl(9, 67%, 51%)
HSB
hsb(9, 79%, 84%)
CMYK
cmyk(0%, 67%, 79%, 16%)
Oklch
oklch(59.5% 0.185 32.5)

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

#B88A73

Tangerine · DarkSalmon · Warm Sun

HEX
#B88A73
RGB
rgb(184, 138, 115)
HSL
hsl(20, 33%, 59%)
HSB
hsb(20, 38%, 72%)
CMYK
cmyk(0%, 25%, 38%, 28%)
Oklch
oklch(67.2% 0.065 47.7)

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

#C4AC90

Ginger · Tan · Warm Sun

HEX
#C4AC90
RGB
rgb(196, 172, 144)
HSL
hsl(32, 31%, 67%)
HSB
hsb(32, 27%, 77%)
CMYK
cmyk(0%, 12%, 27%, 23%)
Oklch
oklch(75.8% 0.048 71.3)

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

#B1AD94

Fresh Green · DarkGray · Sunflower

HEX
#B1AD94
RGB
rgb(177, 173, 148)
HSL
hsl(52, 16%, 64%)
HSB
hsb(52, 16%, 69%)
CMYK
cmyk(0%, 2%, 16%, 31%)
Oklch
oklch(74.4% 0.035 99.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

322E23
242833

Analogous

332724
322E23
303324

Triadic

322E23
24332F
2F2433

Split-Comp.

322E23
243033
272433

Tetradic

322E23
243327
242833
332430

Contrast Matrix WCAG 2.1 Contrast

322E23
D6462C
B88A73
C4AC90
B1AD94
—
3.1
AA Large
4.5
AA Large
6.2
AA
6.0
AA
3.1
AA Large
—
1.5
Fail
2.0
Fail
1.9
Fail
4.5
AA Large
1.5
Fail
—
1.4
Fail
1.3
Fail
6.2
AA
2.0
Fail
1.4
Fail
—
1.0
Fail
6.0
AA
1.9
Fail
1.3
Fail
1.0
Fail
—
White BG
13.5AAA
4.4AA Large
3.0AA Large
2.2Fail
2.3Fail
Black BG
1.6Fail
4.8AA
6.9AA
9.7AAA
9.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

303026
989632
A4A479
BAB997
AFAF9A

Deuteranopia

313126
A0AB34
A7AA7A
BBBD98
B0B09C

Tritanopia

322828
CF3738
B67D7E
C39C9D
B19FA0

Achromatopsia

2E2E2E
6E6E6E
959595
B0B0B0
ABABAB

Shades & Tints Shades & Tints

#322E23

Dark
Light

#D6462C

Dark
Light

#B88A73

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #322e23;
  --color-2: #d6462c;
  --color-3: #b88a73;
  --color-4: #c4ac90;
  --color-5: #b1ad94;
}

SCSS

$color-1: #322e23;
$color-2: #d6462c;
$color-3: #b88a73;
$color-4: #c4ac90;
$color-5: #b1ad94;

TAILWIND

colors: {
  'brand-1': '#322e23',
  'brand-2': '#d6462c',
  'brand-3': '#b88a73',
  'brand-4': '#c4ac90',
  'brand-5': '#b1ad94',
}

RGB Array

[50, 46, 35], [214, 70, 44], [184, 138, 115], [196, 172, 144], [177, 173, 148]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #322E23, #D6462C, #B88A73, #C4AC90, #B1AD94 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: #322e23; --color-2: #d6462c; --color-3: #b88a73; --color-4: #c4ac90; --color-5: #b1ad94. 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 cool-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