← Back to Editor

#CCBFAC · #C49A84 · #A38F88 · #858062 · #856D51

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

#CCBFAC

Goose Yellow · Silver · Warm Sun

HEX
#CCBFAC
RGB
rgb(204, 191, 172)
HSL
hsl(36, 24%, 74%)
HSB
hsb(36, 16%, 80%)
CMYK
cmyk(0%, 6%, 16%, 20%)
Oklch
oklch(81.0% 0.030 77.5)

Traditional「Goose Yellow」· Paint「Warm Sun」· Creative Honey Glow

#C49A84

Apricot · Tan · Warm Sun

HEX
#C49A84
RGB
rgb(196, 154, 132)
HSL
hsl(21, 35%, 64%)
HSB
hsb(21, 33%, 77%)
CMYK
cmyk(0%, 21%, 33%, 23%)
Oklch
oklch(71.9% 0.059 49.0)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#A38F88

Tangerine · Gray · Warm Sun

HEX
#A38F88
RGB
rgb(163, 143, 136)
HSL
hsl(16, 13%, 59%)
HSB
hsb(16, 17%, 64%)
CMYK
cmyk(0%, 12%, 17%, 36%)
Oklch
oklch(66.6% 0.026 40.3)

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

#858062

Autumn Sage · Gray · Honey Gold

HEX
#858062
RGB
rgb(133, 128, 98)
HSL
hsl(51, 15%, 45%)
HSB
hsb(51, 26%, 52%)
CMYK
cmyk(0%, 4%, 26%, 48%)
Oklch
oklch(59.6% 0.044 99.7)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#856D51

Ochre · DimGray · Amber Brown

HEX
#856D51
RGB
rgb(133, 109, 81)
HSL
hsl(32, 24%, 42%)
HSB
hsb(32, 39%, 52%)
CMYK
cmyk(0%, 18%, 39%, 48%)
Oklch
oklch(55.1% 0.051 70.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CCBFAC
ADBACD

Analogous

CDB0AD
CCBFAC
C9CDAD

Triadic

CCBFAC
ADCDC0
C0ADCD

Split-Comp.

CCBFAC
ADC9CD
B0ADCD

Tetradic

CCBFAC
ADCDB0
ADBACD
CDADC9

Contrast Matrix WCAG 2.1 Contrast

CCBFAC
C49A84
A38F88
858062
856D51
—
1.4
Fail
1.7
Fail
2.2
Fail
2.7
Fail
1.4
Fail
—
1.2
Fail
1.6
Fail
1.9
Fail
1.7
Fail
1.2
Fail
—
1.3
Fail
1.6
Fail
2.2
Fail
1.6
Fail
1.3
Fail
—
1.2
Fail
2.7
Fail
1.9
Fail
1.6
Fail
1.2
Fail
—
White BG
1.8Fail
2.5Fail
3.1AA Large
4.0AA Large
4.9AA
Black BG
11.6AAA
8.3AAA
6.8AA
5.3AA
4.3AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

C6C6B1
B2B189
9A9A8A
838369
7B7A58

Deuteranopia

C7C8B2
B4B78B
9C9D8A
83846B
7C7E59

Tritanopia

CBB4B5
C28E8E
A28B8B
856F70
845D5E

Achromatopsia

C1C1C1
A4A4A4
949494
7E7E7E
717171

Shades & Tints Shades & Tints

#CCBFAC

Dark
Light

#C49A84

Dark
Light

#A38F88

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ccbfac;
  --color-2: #c49a84;
  --color-3: #a38f88;
  --color-4: #858062;
  --color-5: #856d51;
}

SCSS

$color-1: #ccbfac;
$color-2: #c49a84;
$color-3: #a38f88;
$color-4: #858062;
$color-5: #856d51;

TAILWIND

colors: {
  'brand-1': '#ccbfac',
  'brand-2': '#c49a84',
  'brand-3': '#a38f88',
  'brand-4': '#858062',
  'brand-5': '#856d51',
}

RGB Array

[204, 191, 172], [196, 154, 132], [163, 143, 136], [133, 128, 98], [133, 109, 81]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #CCBFAC, #C49A84, #A38F88, #858062, #856D51 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: #ccbfac; --color-2: #c49a84; --color-3: #a38f88; --color-4: #858062; --color-5: #856d51. 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