← Back to Editor

#D6C3B1 · #CDCCB9 · #B4C1B8 · #6F6377 · #754B63

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

#D6C3B1

Apricot · Silver · Peach Orange

HEX
#D6C3B1
RGB
rgb(214, 195, 177)
HSL
hsl(29, 31%, 77%)
HSB
hsb(29, 17%, 84%)
CMYK
cmyk(0%, 9%, 17%, 16%)
Oklch
oklch(82.8% 0.033 65.8)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#CDCCB9

Fresh Green · Silver · Lemon Cream

HEX
#CDCCB9
RGB
rgb(205, 204, 185)
HSL
hsl(57, 17%, 76%)
HSB
hsb(57, 10%, 80%)
CMYK
cmyk(0%, 0%, 10%, 20%)
Oklch
oklch(84.1% 0.026 104.5)

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

#B4C1B8

Celadon · Silver · Pearl Gray

HEX
#B4C1B8
RGB
rgb(180, 193, 184)
HSL
hsl(138, 9%, 73%)
HSB
hsb(138, 7%, 76%)
CMYK
cmyk(7%, 0%, 5%, 24%)
Oklch
oklch(79.8% 0.019 155.7)

Traditional「Celadon」· Paint「Pearl Gray」· Creative Silver Lining

#6F6377

Dark Plum · DimGray · Warm Gray

HEX
#6F6377
RGB
rgb(111, 99, 119)
HSL
hsl(276, 9%, 43%)
HSB
hsb(276, 17%, 47%)
CMYK
cmyk(7%, 17%, 0%, 53%)
Oklch
oklch(51.8% 0.034 311.9)

Traditional「Dark Plum」· Paint「Warm Gray」· Creative Urban Concrete

#754B63

Rose Purple · DimGray · Camellia

HEX
#754B63
RGB
rgb(117, 75, 99)
HSL
hsl(326, 22%, 38%)
HSB
hsb(326, 36%, 46%)
CMYK
cmyk(0%, 36%, 15%, 54%)
Oklch
oklch(46.8% 0.066 344.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D6C3B1
B2C5D7

Analogous

D7B2B3
D6C3B1
D7D6B2

Triadic

D6C3B1
B2D7C4
C4B2D7

Split-Comp.

D6C3B1
B2D7D6
B2B3D7

Tetradic

D6C3B1
B3D7B2
B2C5D7
D6B2D7

Contrast Matrix WCAG 2.1 Contrast

D6C3B1
CDCCB9
B4C1B8
6F6377
754B63
—
1.1
Fail
1.1
Fail
3.3
AA Large
4.2
AA Large
1.1
Fail
—
1.1
Fail
3.5
AA Large
4.4
AA Large
1.1
Fail
1.1
Fail
—
3.0
AA Large
3.8
AA Large
3.3
AA Large
3.5
AA Large
3.0
AA Large
—
1.3
Fail
4.2
AA Large
4.4
AA Large
3.8
AA Large
1.3
Fail
—
White BG
1.7Fail
1.6Fail
1.9Fail
5.6AA
7.1AAA
Black BG
12.3AAA
12.9AAA
11.3AAA
3.7AA Large
2.9Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

CECEB5
CDCDBE
BABABA
6A6A72
63625D

Deuteranopia

CFD0B6
CDCDBF
B9B8BB
6B6B71
65685C

Tritanopia

D5B9BA
CDC1C2
B5BCBC
6E6E6E
735958

Achromatopsia

C7C7C7
CACACA
BCBCBC
696969
5A5A5A

Shades & Tints Shades & Tints

#D6C3B1

Dark
Light

#CDCCB9

Dark
Light

#B4C1B8

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d6c3b1;
  --color-2: #cdccb9;
  --color-3: #b4c1b8;
  --color-4: #6f6377;
  --color-5: #754b63;
}

SCSS

$color-1: #d6c3b1;
$color-2: #cdccb9;
$color-3: #b4c1b8;
$color-4: #6f6377;
$color-5: #754b63;

TAILWIND

colors: {
  'brand-1': '#d6c3b1',
  'brand-2': '#cdccb9',
  'brand-3': '#b4c1b8',
  'brand-4': '#6f6377',
  'brand-5': '#754b63',
}

RGB Array

[214, 195, 177], [205, 204, 185], [180, 193, 184], [111, 99, 119], [117, 75, 99]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D6C3B1, #CDCCB9, #B4C1B8, #6F6377, #754B63 is ideal for: brand design, premium product pages, magazine layouts. Low-saturation colors convey a sophisticated, premium feel. 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: #d6c3b1; --color-2: #cdccb9; --color-3: #b4c1b8; --color-4: #6f6377; --color-5: #754b63. 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. 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