← Back to Editor

#CACAB2 · #F9DDC5 · #E5AE78 · #D9978B · #B4A192

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#CACAB2

Fresh Green · Silver · Sunflower

HEX
#CACAB2
RGB
rgb(202, 202, 178)
HSL
hsl(60, 18%, 75%)
HSB
hsb(60, 12%, 79%)
CMYK
cmyk(0%, 0%, 12%, 21%)
Oklch
oklch(83.3% 0.033 107.1)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

#F9DDC5

Apricot · Bisque · Peach Orange

HEX
#F9DDC5
RGB
rgb(249, 221, 197)
HSL
hsl(28, 81%, 87%)
HSB
hsb(28, 21%, 98%)
CMYK
cmyk(0%, 11%, 21%, 2%)
Oklch
oklch(91.4% 0.045 62.8)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#E5AE78

Ginger · BurlyWood · Warm Sun

HEX
#E5AE78
RGB
rgb(229, 174, 120)
HSL
hsl(30, 68%, 68%)
HSB
hsb(30, 48%, 90%)
CMYK
cmyk(0%, 24%, 48%, 10%)
Oklch
oklch(79.0% 0.095 65.2)

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

#D9978B

Peach Pink · DarkSalmon · Coral Red

HEX
#D9978B
RGB
rgb(217, 151, 139)
HSL
hsl(9, 51%, 70%)
HSB
hsb(9, 36%, 85%)
CMYK
cmyk(0%, 30%, 36%, 15%)
Oklch
oklch(73.8% 0.082 30.6)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#B4A192

Apricot · DarkGray · Warm Sun

HEX
#B4A192
RGB
rgb(180, 161, 146)
HSL
hsl(26, 18%, 64%)
HSB
hsb(26, 19%, 71%)
CMYK
cmyk(0%, 11%, 19%, 29%)
Oklch
oklch(72.1% 0.031 60.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CACAB2
B4B4CB

Analogous

CBBFB4
CACAB2
BFCBB4

Triadic

CACAB2
B4CBCB
CBB4CB

Split-Comp.

CACAB2
B4BFCB
BFB4CB

Tetradic

CACAB2
B4CBBF
B4B4CB
CBB4BF

Contrast Matrix WCAG 2.1 Contrast

CACAB2
F9DDC5
E5AE78
D9978B
B4A192
—
1.3
Fail
1.2
Fail
1.4
Fail
1.5
Fail
1.3
Fail
—
1.5
Fail
1.8
Fail
1.9
Fail
1.2
Fail
1.5
Fail
—
1.2
Fail
1.3
Fail
1.4
Fail
1.8
Fail
1.2
Fail
—
1.0
Fail
1.5
Fail
1.9
Fail
1.3
Fail
1.0
Fail
—
White BG
1.7Fail
1.3Fail
2.0Fail
2.4Fail
2.5Fail
Black BG
12.6AAA
16.2AAA
10.7AAA
8.7AAA
8.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

CACAB8
EDEDCB
CDCD85
BCBC8E
ACAC96

Deuteranopia

CACAB9
EFF1CC
D0D488
C0C58F
ADAE97

Tritanopia

CABCBD
F8CFD0
E28F92
D69091
B39899

Achromatopsia

C7C7C7
E3E3E3
B8B8B8
A9A9A9
A5A5A5

Shades & Tints Shades & Tints

#CACAB2

Dark
Light

#F9DDC5

Dark
Light

#E5AE78

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cacab2;
  --color-2: #f9ddc5;
  --color-3: #e5ae78;
  --color-4: #d9978b;
  --color-5: #b4a192;
}

SCSS

$color-1: #cacab2;
$color-2: #f9ddc5;
$color-3: #e5ae78;
$color-4: #d9978b;
$color-5: #b4a192;

TAILWIND

colors: {
  'brand-1': '#cacab2',
  'brand-2': '#f9ddc5',
  'brand-3': '#e5ae78',
  'brand-4': '#d9978b',
  'brand-5': '#b4a192',
}

RGB Array

[202, 202, 178], [249, 221, 197], [229, 174, 120], [217, 151, 139], [180, 161, 146]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #CACAB2, #F9DDC5, #E5AE78, #D9978B, #B4A192 is ideal for: health products, baby brands, fresh-style blogs. 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: #cacab2; --color-2: #f9ddc5; --color-3: #e5ae78; --color-4: #d9978b; --color-5: #b4a192. 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?

Light tones suit backgrounds; use dark colors for body text. Mid-tones work for card backgrounds or dividers to add depth. 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