← Back to Editor

#CCAC81 · #E5CEA0 · #EBDDBA · #B2AB8E · #735C39

skin

A 5-color skin 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

#CCAC81

Ginger · Tan · Warm Sun

HEX
#CCAC81
RGB
rgb(204, 172, 129)
HSL
hsl(34, 42%, 65%)
HSB
hsb(34, 37%, 80%)
CMYK
cmyk(0%, 16%, 37%, 20%)
Oklch
oklch(76.2% 0.069 74.7)

TraditionalGinger」· PaintWarm Sun」· Creative Honey Glow

#E5CEA0

Goose Yellow · Wheat · Lemon Cream

HEX
#E5CEA0
RGB
rgb(229, 206, 160)
HSL
hsl(40, 57%, 76%)
HSB
hsb(40, 30%, 90%)
CMYK
cmyk(0%, 10%, 30%, 10%)
Oklch
oklch(85.9% 0.066 84.4)

TraditionalGoose Yellow」· PaintLemon Cream」· Creative Lemon Fizz

#EBDDBA

Goose Yellow · Wheat · Lemon Cream

HEX
#EBDDBA
RGB
rgb(235, 221, 186)
HSL
hsl(43, 55%, 83%)
HSB
hsb(43, 21%, 92%)
CMYK
cmyk(0%, 6%, 21%, 8%)
Oklch
oklch(90.0% 0.049 88.8)

TraditionalGoose Yellow」· PaintLemon Cream」· Creative Lemon Fizz

#B2AB8E

Ginger · DarkGray · Sunflower

HEX
#B2AB8E
RGB
rgb(178, 171, 142)
HSL
hsl(48, 19%, 63%)
HSB
hsb(48, 20%, 70%)
CMYK
cmyk(0%, 4%, 20%, 30%)
Oklch
oklch(73.9% 0.041 96.0)

TraditionalGinger」· PaintSunflower」· Creative Lemon Fizz

#735C39

Ochre · DarkOliveGreen · Amber Brown

HEX
#735C39
RGB
rgb(115, 92, 57)
HSL
hsl(36, 34%, 34%)
HSB
hsb(36, 50%, 45%)
CMYK
cmyk(0%, 20%, 50%, 55%)
Oklch
oklch(48.9% 0.059 77.2)

TraditionalOchre」· PaintAmber Brown」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CCAC81
80A1CB

Analogous

CB8580
CCAC81
C6CB80

Triadic

CCAC81
80CBAB
AB80CB

Split-Comp.

CCAC81
80C6CB
8580CB

Tetradic

CCAC81
80CB85
80A1CB
CB80C6

Contrast Matrix WCAG 2.1 Contrast

CCAC81
E5CEA0
EBDDBA
B2AB8E
735C39
1.4
Fail
1.6
Fail
1.1
Fail
2.9
Fail
1.4
Fail
1.1
Fail
1.5
Fail
4.1
AA Large
1.6
Fail
1.1
Fail
1.7
Fail
4.7
AA
1.1
Fail
1.5
Fail
1.7
Fail
2.7
Fail
2.9
Fail
4.1
AA Large
4.7
AA
2.7
Fail
White BG
2.1Fail
1.5Fail
1.3Fail
2.3Fail
6.3AA
Black BG
9.8AAA
13.7AAA
15.6AAA
9.1AAA
3.3AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

BEBE8B
DBDBAB
E5E5C2
AFAF95
696941

Deuteranopia

C0C28E
DCDEAE
E6E7C5
AFB097
6A6C44

Tritanopia

CA9495
E4B4B6
EAC9CB
B29B9C
72484A

Achromatopsia

B1B1B1
D0D0D0
DDDDDD
AAAAAA
5F5F5F

Shades & Tints Shades & Tints

#CCAC81

Dark
Light

#E5CEA0

Dark
Light

#EBDDBA

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ccac81;
  --color-2: #e5cea0;
  --color-3: #ebddba;
  --color-4: #b2ab8e;
  --color-5: #735c39;
}

SCSS

$color-1: #ccac81;
$color-2: #e5cea0;
$color-3: #ebddba;
$color-4: #b2ab8e;
$color-5: #735c39;

TAILWIND

colors: {
  'brand-1': '#ccac81',
  'brand-2': '#e5cea0',
  'brand-3': '#ebddba',
  'brand-4': '#b2ab8e',
  'brand-5': '#735c39',
}

RGB Array

[204, 172, 129], [229, 206, 160], [235, 221, 186], [178, 171, 142], [115, 92, 57]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This skin-style palette of #CCAC81, #E5CEA0, #EBDDBA, #B2AB8E, #735C39 is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #ccac81; --color-2: #e5cea0; --color-3: #ebddba; --color-4: #b2ab8e; --color-5: #735c39. 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 skin-style 5-color scheme is especially suited for tech, SaaS, healthcare, eco industries. 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