← Back to Editor

#D4C5B2 · #BD9736 · #E85E44 · #C9486F · #ED5E93

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 Library

Color Details Color Details

#D4C5B2

Goose Yellow · Silver · Peach Orange

HEX
#D4C5B2
RGB
rgb(212, 197, 178)
HSL
hsl(34, 28%, 76%)
HSB
hsb(34, 16%, 83%)
CMYK
cmyk(0%, 7%, 16%, 17%)
Oklch
oklch(83.1% 0.031 73.8)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

#BD9736

Ochre · GoldenRod · Honey Gold

HEX
#BD9736
RGB
rgb(189, 151, 54)
HSL
hsl(43, 56%, 48%)
HSB
hsb(43, 71%, 74%)
CMYK
cmyk(0%, 20%, 71%, 26%)
Oklch
oklch(69.4% 0.121 86.9)

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

#E85E44

Vermilion · Tomato · Passion Red

HEX
#E85E44
RGB
rgb(232, 94, 68)
HSL
hsl(10, 78%, 59%)
HSB
hsb(10, 71%, 91%)
CMYK
cmyk(0%, 59%, 71%, 9%)
Oklch
oklch(65.5% 0.177 32.6)

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

#C9486F

Dark Violet · MediumVioletRed · Rose Pink

HEX
#C9486F
RGB
rgb(201, 72, 111)
HSL
hsl(342, 54%, 54%)
HSB
hsb(342, 64%, 79%)
CMYK
cmyk(0%, 64%, 45%, 21%)
Oklch
oklch(58.8% 0.166 5.2)

Traditional「Dark Violet」· Paint「Rose Pink」· Creative Blush Sunrise

#ED5E93

Rouge · LightCoral · Rose Pink

HEX
#ED5E93
RGB
rgb(237, 94, 147)
HSL
hsl(338, 80%, 65%)
HSB
hsb(338, 60%, 93%)
CMYK
cmyk(0%, 60%, 38%, 7%)
Oklch
oklch(67.9% 0.183 0.1)

Traditional「Rouge」· Paint「Rose Pink」· Creative Rose Petal

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D4C5B2
B1C0D3

Analogous

D3B3B1
D4C5B2
D1D3B1

Triadic

D4C5B2
B1D3C4
C4B1D3

Split-Comp.

D4C5B2
B1D1D3
B3B1D3

Tetradic

D4C5B2
B1D3B3
B1C0D3
D3B1D1

Contrast Matrix WCAG 2.1 Contrast

D4C5B2
BD9736
E85E44
C9486F
ED5E93
—
1.6
Fail
2.0
Fail
2.7
Fail
1.9
Fail
1.6
Fail
—
1.2
Fail
1.6
Fail
1.2
Fail
2.0
Fail
1.2
Fail
—
1.3
Fail
1.1
Fail
2.7
Fail
1.6
Fail
1.3
Fail
—
1.4
Fail
1.9
Fail
1.2
Fail
1.1
Fail
1.4
Fail
—
White BG
1.7Fail
2.7Fail
3.4AA Large
4.5AA
3.2AA Large
Black BG
12.4AAA
7.6AAA
6.1AA
4.6AA
6.6AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

CECDB7
ADAC4D
ACAB4A
919066
AFAE86

Deuteranopia

CECFB8
AFB253
B4BF4C
99A263
B7C283

Tritanopia

D3BABB
BB6064
E14F50
C35E5C
E67C7A

Achromatopsia

C7C7C7
979797
848484
737373
8F8F8F

Shades & Tints Shades & Tints

#D4C5B2

Dark
Light

#BD9736

Dark
Light

#E85E44

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d4c5b2;
  --color-2: #bd9736;
  --color-3: #e85e44;
  --color-4: #c9486f;
  --color-5: #ed5e93;
}

SCSS

$color-1: #d4c5b2;
$color-2: #bd9736;
$color-3: #e85e44;
$color-4: #c9486f;
$color-5: #ed5e93;

TAILWIND

colors: {
  'brand-1': '#d4c5b2',
  'brand-2': '#bd9736',
  'brand-3': '#e85e44',
  'brand-4': '#c9486f',
  'brand-5': '#ed5e93',
}

RGB Array

[212, 197, 178], [189, 151, 54], [232, 94, 68], [201, 72, 111], [237, 94, 147]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D4C5B2, #BD9736, #E85E44, #C9486F, #ED5E93 is ideal for: corporate websites, product showcases, portfolios. 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: #d4c5b2; --color-2: #bd9736; --color-3: #e85e44; --color-4: #c9486f; --color-5: #ed5e93. 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. 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