← Back to Editor

#CBAB7F · #E2CCAA · #B09193 · #81597F · #453C62

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#CBAB7F

Ginger · Tan · Warm Sun

HEX
#CBAB7F
RGB
rgb(203, 171, 127)
HSL
hsl(35, 42%, 65%)
HSB
hsb(35, 37%, 80%)
CMYK
cmyk(0%, 16%, 37%, 20%)
Oklch
oklch(75.9% 0.070 75.2)

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

#E2CCAA

Goose Yellow · Wheat · Peach Orange

HEX
#E2CCAA
RGB
rgb(226, 204, 170)
HSL
hsl(36, 49%, 78%)
HSB
hsb(36, 25%, 89%)
CMYK
cmyk(0%, 10%, 25%, 11%)
Oklch
oklch(85.5% 0.052 78.7)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

#B09193

Peach Pink · DarkGray · Coral Red

HEX
#B09193
RGB
rgb(176, 145, 147)
HSL
hsl(356, 16%, 63%)
HSB
hsb(356, 18%, 69%)
CMYK
cmyk(0%, 18%, 16%, 31%)
Oklch
oklch(68.6% 0.037 13.7)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

#81597F

Rose Purple · DimGray · Violet

HEX
#81597F
RGB
rgb(129, 89, 127)
HSL
hsl(303, 18%, 43%)
HSB
hsb(303, 31%, 51%)
CMYK
cmyk(0%, 31%, 2%, 49%)
Oklch
oklch(52.0% 0.076 328.3)

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

#453C62

Deep Indigo · DarkSlateGray · Prussian Blue

HEX
#453C62
RGB
rgb(69, 60, 98)
HSL
hsl(254, 24%, 31%)
HSB
hsb(254, 39%, 38%)
CMYK
cmyk(30%, 39%, 0%, 62%)
Oklch
oklch(38.3% 0.064 294.0)

Traditional「Deep Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CBAB7F
80A0CB

Analogous

CB8780
CBAB7F
C5CB80

Triadic

CBAB7F
80CBAC
AC80CB

Split-Comp.

CBAB7F
80C5CB
8780CB

Tetradic

CBAB7F
80CB87
80A0CB
CB80C5

Contrast Matrix WCAG 2.1 Contrast

CBAB7F
E2CCAA
B09193
81597F
453C62
—
1.4
Fail
1.3
Fail
2.6
Fail
4.7
AA
1.4
Fail
—
1.8
Fail
3.7
AA Large
6.5
AA
1.3
Fail
1.8
Fail
—
2.0
Fail
3.5
AA Large
2.6
Fail
3.7
AA Large
2.0
Fail
—
1.8
Fail
4.7
AA
6.5
AA
3.5
AA Large
1.8
Fail
—
White BG
2.2Fail
1.6Fail
2.9Fail
5.7AA
10.1AAA
Black BG
9.7AAA
13.5AAA
7.3AAA
3.7AA Large
2.1Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

BDBD8A
D8D8B2
A3A293
706F76
414159

Deuteranopia

BFC18C
DADBB4
A4A792
727574
424257

Tritanopia

C99294
E1B9BA
AE9292
7F6F6D
455250

Achromatopsia

B0B0B0
CFCFCF
9A9A9A
696969
434343

Shades & Tints Shades & Tints

#CBAB7F

Dark
Light

#E2CCAA

Dark
Light

#B09193

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cbab7f;
  --color-2: #e2ccaa;
  --color-3: #b09193;
  --color-4: #81597f;
  --color-5: #453c62;
}

SCSS

$color-1: #cbab7f;
$color-2: #e2ccaa;
$color-3: #b09193;
$color-4: #81597f;
$color-5: #453c62;

TAILWIND

colors: {
  'brand-1': '#cbab7f',
  'brand-2': '#e2ccaa',
  'brand-3': '#b09193',
  'brand-4': '#81597f',
  'brand-5': '#453c62',
}

RGB Array

[203, 171, 127], [226, 204, 170], [176, 145, 147], [129, 89, 127], [69, 60, 98]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #CBAB7F, #E2CCAA, #B09193, #81597F, #453C62 is ideal for: brand design, premium product pages, magazine layouts, infographics, data visualization, accessible design. Low-saturation colors convey a sophisticated, premium feel. High contrast ensures clear visual hierarchy and readability. 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: #cbab7f; --color-2: #e2ccaa; --color-3: #b09193; --color-4: #81597f; --color-5: #453c62. 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. 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