← Back to Editor

#C2BAA8 · #645D4C · #857E6C · #ACA289 · #CCC3B1

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

#C2BAA8

Goose Yellow · Silver · Sunflower

HEX
#C2BAA8
RGB
rgb(194, 186, 168)
HSL
hsl(42, 18%, 71%)
HSB
hsb(42, 13%, 76%)
CMYK
cmyk(0%, 4%, 13%, 24%)
Oklch
oklch(79.1% 0.026 86.9)

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

#645D4C

Ochre · DimGray · Honey Gold

HEX
#645D4C
RGB
rgb(100, 93, 76)
HSL
hsl(42, 14%, 35%)
HSB
hsb(42, 24%, 39%)
CMYK
cmyk(0%, 7%, 24%, 61%)
Oklch
oklch(48.0% 0.028 88.3)

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

#857E6C

Ochre · Gray · Honey Gold

HEX
#857E6C
RGB
rgb(133, 126, 108)
HSL
hsl(43, 10%, 47%)
HSB
hsb(43, 19%, 52%)
CMYK
cmyk(0%, 5%, 19%, 48%)
Oklch
oklch(59.4% 0.028 89.3)

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

#ACA289

Ginger · DarkGray · Sunflower

HEX
#ACA289
RGB
rgb(172, 162, 137)
HSL
hsl(43, 17%, 61%)
HSB
hsb(43, 20%, 67%)
CMYK
cmyk(0%, 6%, 20%, 33%)
Oklch
oklch(71.4% 0.037 88.8)

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

#CCC3B1

Goose Yellow · Silver · Sunflower

HEX
#CCC3B1
RGB
rgb(204, 195, 177)
HSL
hsl(40, 21%, 75%)
HSB
hsb(40, 13%, 80%)
CMYK
cmyk(0%, 4%, 13%, 20%)
Oklch
oklch(82.0% 0.027 84.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C2BAA8
A8B0C2

Analogous

C2ADA8
C2BAA8
BDC2A8

Triadic

C2BAA8
A8C2BA
BAA8C2

Split-Comp.

C2BAA8
A8BDC2
ADA8C2

Tetradic

C2BAA8
A8C2AD
A8B0C2
C2A8BD

Contrast Matrix WCAG 2.1 Contrast

C2BAA8
645D4C
857E6C
ACA289
CCC3B1
—
3.4
AA Large
2.1
Fail
1.3
Fail
1.1
Fail
3.4
AA Large
—
1.6
Fail
2.6
Fail
3.7
AA Large
2.1
Fail
1.6
Fail
—
1.6
Fail
2.3
Fail
1.3
Fail
2.6
Fail
1.6
Fail
—
1.4
Fail
1.1
Fail
3.7
AA Large
2.3
Fail
1.4
Fail
—
White BG
1.9Fail
6.5AA
4.0AA Large
2.5Fail
1.7Fail
Black BG
10.9AAA
3.2AA Large
5.2AA
8.3AAA
12.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

BFBEAC
616150
828270
A8A88F
C8C8B5

Deuteranopia

BFC0AD
616251
828371
A8A991
C9C9B6

Tritanopia

C2B0B1
645354
857475
AC9495
CCB9BA

Achromatopsia

BABABA
5D5D5D
7E7E7E
A2A2A2
C4C4C4

Shades & Tints Shades & Tints

#C2BAA8

Dark
Light

#645D4C

Dark
Light

#857E6C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c2baa8;
  --color-2: #645d4c;
  --color-3: #857e6c;
  --color-4: #aca289;
  --color-5: #ccc3b1;
}

SCSS

$color-1: #c2baa8;
$color-2: #645d4c;
$color-3: #857e6c;
$color-4: #aca289;
$color-5: #ccc3b1;

TAILWIND

colors: {
  'brand-1': '#c2baa8',
  'brand-2': '#645d4c',
  'brand-3': '#857e6c',
  'brand-4': '#aca289',
  'brand-5': '#ccc3b1',
}

RGB Array

[194, 186, 168], [100, 93, 76], [133, 126, 108], [172, 162, 137], [204, 195, 177]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C2BAA8, #645D4C, #857E6C, #ACA289, #CCC3B1 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: #c2baa8; --color-2: #645d4c; --color-3: #857e6c; --color-4: #aca289; --color-5: #ccc3b1. 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