← Back to Editor

#D4C494 · #99998B · #967A6C · #8A5564 · #402B36

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

#D4C494

Goose Yellow · Tan · Sunflower

HEX
#D4C494
RGB
rgb(212, 196, 148)
HSL
hsl(45, 43%, 71%)
HSB
hsb(45, 30%, 83%)
CMYK
cmyk(0%, 8%, 30%, 17%)
Oklch
oklch(82.2% 0.066 91.8)

Traditional「Goose Yellow」· Paint「Sunflower」· Creative Lemon Fizz

#99998B

Ash · DarkSeaGreen · Silver Sand

HEX
#99998B
RGB
rgb(153, 153, 139)
HSL
hsl(60, 6%, 57%)
HSB
hsb(60, 9%, 60%)
CMYK
cmyk(0%, 0%, 9%, 40%)
Oklch
oklch(67.9% 0.020 106.9)

Traditional「Ash」· Paint「Silver Sand」· Creative Urban Concrete

#967A6C

Tangerine · Gray · Warm Sun

HEX
#967A6C
RGB
rgb(150, 122, 108)
HSL
hsl(20, 17%, 51%)
HSB
hsb(20, 28%, 59%)
CMYK
cmyk(0%, 19%, 28%, 41%)
Oklch
oklch(60.2% 0.041 48.0)

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

#8A5564

Dark Violet · DimGray · Camellia

HEX
#8A5564
RGB
rgb(138, 85, 100)
HSL
hsl(343, 24%, 44%)
HSB
hsb(343, 38%, 54%)
CMYK
cmyk(0%, 38%, 28%, 46%)
Oklch
oklch(51.4% 0.073 1.6)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

#402B36

Rose Purple · DarkSlateGray · Raspberry

HEX
#402B36
RGB
rgb(64, 43, 54)
HSL
hsl(329, 20%, 21%)
HSB
hsb(329, 33%, 25%)
CMYK
cmyk(0%, 33%, 16%, 75%)
Oklch
oklch(31.8% 0.036 346.6)

Traditional「Rose Purple」· Paint「Raspberry」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D4C494
95A5D5

Analogous

D5A595
D4C494
C5D595

Triadic

D4C494
95D5C5
C595D5

Split-Comp.

D4C494
95C5D5
A595D5

Tetradic

D4C494
95D5A5
95A5D5
D595C5

Contrast Matrix WCAG 2.1 Contrast

D4C494
99998B
967A6C
8A5564
402B36
—
1.7
Fail
2.3
Fail
3.4
AA Large
7.5
AAA
1.7
Fail
—
1.4
Fail
2.0
Fail
4.5
AA
2.3
Fail
1.4
Fail
—
1.5
Fail
3.3
AA Large
3.4
AA Large
2.0
Fail
1.5
Fail
—
2.2
Fail
7.5
AAA
4.5
AA
3.3
AA Large
2.2
Fail
—
White BG
1.7Fail
2.9Fail
4.0AA Large
5.9AA
13.0AAA
Black BG
12.1AAA
7.3AAA
5.3AA
3.6AA Large
1.6Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

CDCDA0
99998E
8A8A6F
737360
373733

Deuteranopia

CECFA2
99998F
8C8E70
767A60
383A33

Tritanopia

D3A9AB
999192
957273
875E5D
3F3131

Achromatopsia

C3C3C3
979797
818181
676767
333333

Shades & Tints Shades & Tints

#D4C494

Dark
Light

#99998B

Dark
Light

#967A6C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d4c494;
  --color-2: #99998b;
  --color-3: #967a6c;
  --color-4: #8a5564;
  --color-5: #402b36;
}

SCSS

$color-1: #d4c494;
$color-2: #99998b;
$color-3: #967a6c;
$color-4: #8a5564;
$color-5: #402b36;

TAILWIND

colors: {
  'brand-1': '#d4c494',
  'brand-2': '#99998b',
  'brand-3': '#967a6c',
  'brand-4': '#8a5564',
  'brand-5': '#402b36',
}

RGB Array

[212, 196, 148], [153, 153, 139], [150, 122, 108], [138, 85, 100], [64, 43, 54]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D4C494, #99998B, #967A6C, #8A5564, #402B36 is ideal for: brand design, premium product pages, magazine layouts, infographics, data visualization, accessible design. Low-saturation colors convey a sophisticated, premium feel. High contrast ensures clear visual hierarchy and readability. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #d4c494; --color-2: #99998b; --color-3: #967a6c; --color-4: #8a5564; --color-5: #402b36. 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. Restrained colors convey professionalism and trust. 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