← Back to Editor

#D4D9A5 · #CBB589 · #B87F74 · #FA4D53 · #5E5E50

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

#D4D9A5

Fresh Green · Wheat · Sunflower

HEX
#D4D9A5
RGB
rgb(212, 217, 165)
HSL
hsl(66, 41%, 75%)
HSB
hsb(66, 24%, 85%)
CMYK
cmyk(2%, 0%, 24%, 15%)
Oklch
oklch(86.9% 0.069 112.3)

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

#CBB589

Ginger · Tan · Sunflower

HEX
#CBB589
RGB
rgb(203, 181, 137)
HSL
hsl(40, 39%, 67%)
HSB
hsb(40, 33%, 80%)
CMYK
cmyk(0%, 11%, 33%, 20%)
Oklch
oklch(78.1% 0.064 84.4)

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

#B87F74

Crimson · DarkSalmon · Passion Red

HEX
#B87F74
RGB
rgb(184, 127, 116)
HSL
hsl(10, 32%, 59%)
HSB
hsb(10, 37%, 72%)
CMYK
cmyk(0%, 31%, 37%, 28%)
Oklch
oklch(65.1% 0.073 31.3)

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

#FA4D53

Peach Pink · Tomato · Coral Red

HEX
#FA4D53
RGB
rgb(250, 77, 83)
HSL
hsl(358, 95%, 64%)
HSB
hsb(358, 69%, 98%)
CMYK
cmyk(0%, 69%, 67%, 2%)
Oklch
oklch(66.6% 0.209 23.1)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

#5E5E50

Autumn Sage · DimGray · Charcoal

HEX
#5E5E50
RGB
rgb(94, 94, 80)
HSL
hsl(60, 8%, 34%)
HSB
hsb(60, 15%, 37%)
CMYK
cmyk(0%, 0%, 15%, 63%)
Oklch
oklch(47.8% 0.022 107.2)

Traditional「Autumn Sage」· Paint「Charcoal」· Creative Midnight Shadow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D4D9A5
AAA5D9

Analogous

D9C4A5
D4D9A5
BAD9A5

Triadic

D4D9A5
A5D4D9
D9A5D4

Split-Comp.

D4D9A5
A5BAD9
C4A5D9

Tetradic

D4D9A5
A5D9C4
AAA5D9
D9A5BA

Contrast Matrix WCAG 2.1 Contrast

D4D9A5
CBB589
B87F74
FA4D53
5E5E50
—
1.4
Fail
2.3
Fail
2.3
Fail
4.5
AA Large
1.4
Fail
—
1.7
Fail
1.7
Fail
3.3
AA Large
2.3
Fail
1.7
Fail
—
1.0
Fail
2.0
Fail
2.3
Fail
1.7
Fail
1.0
Fail
—
2.0
Fail
4.5
AA Large
3.3
AA Large
2.0
Fail
2.0
Fail
—
White BG
1.5Fail
2.0Fail
3.3AA Large
3.4AA Large
6.6AA
Black BG
14.3AAA
10.5AAA
6.3AA
6.3AA
3.2AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

D6D6B2
C1C194
9F9F77
AFAE52
5E5E53

Deuteranopia

D6D5B5
C3C496
A3A777
B9C651
5E5E54

Tritanopia

D4BCBE
CA9C9E
B57979
F15050
5E5657

Achromatopsia

D2D2D2
B7B7B7
8F8F8F
818181
5C5C5C

Shades & Tints Shades & Tints

#D4D9A5

Dark
Light

#CBB589

Dark
Light

#B87F74

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d4d9a5;
  --color-2: #cbb589;
  --color-3: #b87f74;
  --color-4: #fa4d53;
  --color-5: #5e5e50;
}

SCSS

$color-1: #d4d9a5;
$color-2: #cbb589;
$color-3: #b87f74;
$color-4: #fa4d53;
$color-5: #5e5e50;

TAILWIND

colors: {
  'brand-1': '#d4d9a5',
  'brand-2': '#cbb589',
  'brand-3': '#b87f74',
  'brand-4': '#fa4d53',
  'brand-5': '#5e5e50',
}

RGB Array

[212, 217, 165], [203, 181, 137], [184, 127, 116], [250, 77, 83], [94, 94, 80]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D4D9A5, #CBB589, #B87F74, #FA4D53, #5E5E50 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: #d4d9a5; --color-2: #cbb589; --color-3: #b87f74; --color-4: #fa4d53; --color-5: #5e5e50. 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 general-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