← Back to Editor

#D4CCB5 · #C7BFA8 · #AFA991 · #6D6552 · #353126

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

#D4CCB5

Goose Yellow · Silver · Lemon Cream

HEX
#D4CCB5
RGB
rgb(212, 204, 181)
HSL
hsl(45, 26%, 77%)
HSB
hsb(45, 15%, 83%)
CMYK
cmyk(0%, 4%, 15%, 17%)
Oklch
oklch(84.6% 0.032 91.1)

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

#C7BFA8

Goose Yellow · Silver · Sunflower

HEX
#C7BFA8
RGB
rgb(199, 191, 168)
HSL
hsl(45, 22%, 72%)
HSB
hsb(45, 16%, 78%)
CMYK
cmyk(0%, 4%, 16%, 22%)
Oklch
oklch(80.5% 0.033 91.1)

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

#AFA991

Ginger · DarkGray · Sunflower

HEX
#AFA991
RGB
rgb(175, 169, 145)
HSL
hsl(48, 16%, 63%)
HSB
hsb(48, 17%, 69%)
CMYK
cmyk(0%, 3%, 17%, 31%)
Oklch
oklch(73.3% 0.034 95.5)

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

#6D6552

Ochre · DimGray · Honey Gold

HEX
#6D6552
RGB
rgb(109, 101, 82)
HSL
hsl(42, 14%, 37%)
HSB
hsb(42, 25%, 43%)
CMYK
cmyk(0%, 7%, 25%, 57%)
Oklch
oklch(50.9% 0.031 87.9)

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

#353126

Ochre · DarkSlateGray · Amber Gold

HEX
#353126
RGB
rgb(53, 49, 38)
HSL
hsl(44, 16%, 18%)
HSB
hsb(44, 28%, 21%)
CMYK
cmyk(0%, 8%, 28%, 79%)
Oklch
oklch(31.4% 0.020 90.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D4CCB5
B5BDD4

Analogous

D4BDB5
D4CCB5
CCD4B5

Triadic

D4CCB5
B5D4CC
CCB5D4

Split-Comp.

D4CCB5
B5CCD4
BDB5D4

Tetradic

D4CCB5
B5D4BD
B5BDD4
D4B5CC

Contrast Matrix WCAG 2.1 Contrast

D4CCB5
C7BFA8
AFA991
6D6552
353126
—
1.1
Fail
1.5
Fail
3.6
AA Large
8.1
AAA
1.1
Fail
—
1.3
Fail
3.2
AA Large
7.1
AAA
1.5
Fail
1.3
Fail
—
2.5
Fail
5.5
AA
3.6
AA Large
3.2
AA Large
2.5
Fail
—
2.2
Fail
8.1
AAA
7.1
AAA
5.5
AA
2.2
Fail
—
White BG
1.6Fail
1.8Fail
2.4Fail
5.8AA
13.0AAA
Black BG
13.1AAA
11.4AAA
8.9AAA
3.6AA Large
1.6Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

D1D0BB
C4C3AE
ACAC97
6A6957
333329

Deuteranopia

D1D2BC
C4C5AF
ADAD98
6A6B58
343429

Tritanopia

D4BFC0
C7B2B3
AF9B9C
6D5A5B
352B2B

Achromatopsia

CCCCCC
BFBFBF
A8A8A8
656565
313131

Shades & Tints Shades & Tints

#D4CCB5

Dark
Light

#C7BFA8

Dark
Light

#AFA991

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d4ccb5;
  --color-2: #c7bfa8;
  --color-3: #afa991;
  --color-4: #6d6552;
  --color-5: #353126;
}

SCSS

$color-1: #d4ccb5;
$color-2: #c7bfa8;
$color-3: #afa991;
$color-4: #6d6552;
$color-5: #353126;

TAILWIND

colors: {
  'brand-1': '#d4ccb5',
  'brand-2': '#c7bfa8',
  'brand-3': '#afa991',
  'brand-4': '#6d6552',
  'brand-5': '#353126',
}

RGB Array

[212, 204, 181], [199, 191, 168], [175, 169, 145], [109, 101, 82], [53, 49, 38]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D4CCB5, #C7BFA8, #AFA991, #6D6552, #353126 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: #d4ccb5; --color-2: #c7bfa8; --color-3: #afa991; --color-4: #6d6552; --color-5: #353126. 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