← Back to Editor

#CCA884 · #EBDEBB · #C9A130 · #A8471A · #35140D

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

#CCA884

Ginger · Tan · Warm Sun

HEX
#CCA884
RGB
rgb(204, 168, 132)
HSL
hsl(30, 41%, 66%)
HSB
hsb(30, 35%, 80%)
CMYK
cmyk(0%, 18%, 35%, 20%)
Oklch
oklch(75.5% 0.065 66.6)

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

#EBDEBB

Goose Yellow · Wheat · Lemon Cream

HEX
#EBDEBB
RGB
rgb(235, 222, 187)
HSL
hsl(44, 55%, 83%)
HSB
hsb(44, 20%, 92%)
CMYK
cmyk(0%, 6%, 20%, 8%)
Oklch
oklch(90.2% 0.048 90.1)

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

#C9A130

Ochre · GoldenRod · Honey Gold

HEX
#C9A130
RGB
rgb(201, 161, 48)
HSL
hsl(44, 61%, 49%)
HSB
hsb(44, 76%, 79%)
CMYK
cmyk(0%, 20%, 76%, 21%)
Oklch
oklch(72.7% 0.133 88.3)

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

#A8471A

Tangerine · Sienna · Amber Brown

HEX
#A8471A
RGB
rgb(168, 71, 26)
HSL
hsl(19, 73%, 38%)
HSB
hsb(19, 85%, 66%)
CMYK
cmyk(0%, 58%, 85%, 34%)
Oklch
oklch(51.9% 0.139 42.4)

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

#35140D

Vermilion · Black · Deep Berry

HEX
#35140D
RGB
rgb(53, 20, 13)
HSL
hsl(10, 61%, 13%)
HSB
hsb(10, 75%, 21%)
CMYK
cmyk(0%, 62%, 75%, 79%)
Oklch
oklch(24.0% 0.055 33.4)

Traditional「Vermilion」· Paint「Deep Berry」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CCA884
85A8CC

Analogous

CC8585
CCA884
CCCC85

Triadic

CCA884
85CCA8
A885CC

Split-Comp.

CCA884
85CCCC
8585CC

Tetradic

CCA884
85CC85
85A8CC
CC85CC

Contrast Matrix WCAG 2.1 Contrast

CCA884
EBDEBB
C9A130
A8471A
35140D
—
1.7
Fail
1.1
Fail
2.7
Fail
7.6
AAA
1.7
Fail
—
1.8
Fail
4.4
AA Large
12.5
AAA
1.1
Fail
1.8
Fail
—
2.4
Fail
6.9
AA
2.7
Fail
4.4
AA Large
2.4
Fail
—
2.8
Fail
7.6
AAA
12.5
AAA
6.9
AA
2.8
Fail
—
White BG
2.2Fail
1.3Fail
2.4Fail
5.9AA
16.7AAA
Black BG
9.5AAA
15.7AAA
8.6AAA
3.6AA Large
1.3Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

BCBC8D
E5E5C3
B8B74B
7E7D25
27260F

Deuteranopia

BFC18F
E6E7C6
BABD52
848B28
292B0F

Tritanopia

CA9495
EACACC
C76166
A32D2F
331010

Achromatopsia

AFAFAF
DEDEDE
A0A0A0
5F5F5F
1D1D1D

Shades & Tints Shades & Tints

#CCA884

Dark
Light

#EBDEBB

Dark
Light

#C9A130

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cca884;
  --color-2: #ebdebb;
  --color-3: #c9a130;
  --color-4: #a8471a;
  --color-5: #35140d;
}

SCSS

$color-1: #cca884;
$color-2: #ebdebb;
$color-3: #c9a130;
$color-4: #a8471a;
$color-5: #35140d;

TAILWIND

colors: {
  'brand-1': '#cca884',
  'brand-2': '#ebdebb',
  'brand-3': '#c9a130',
  'brand-4': '#a8471a',
  'brand-5': '#35140d',
}

RGB Array

[204, 168, 132], [235, 222, 187], [201, 161, 48], [168, 71, 26], [53, 20, 13]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #CCA884, #EBDEBB, #C9A130, #A8471A, #35140D 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: #cca884; --color-2: #ebdebb; --color-3: #c9a130; --color-4: #a8471a; --color-5: #35140d. 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. 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