#CCB5AD + #D53745 + #DB8E84 + #E2DBC8 + #BEBB92 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#CCB5AD

Apricot · Silver · Warm Sun

HEX

#CCB5AD

RGB

rgb(204, 181, 173)

HSL

hsl(15, 23%, 74%)

HSB

hsb(15, 15%, 80%)

CMYK

cmyk(0%, 11%, 15%, 20%)

Oklch

oklch(79.0% 0.029 40.2)

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

#D53745

Vermilion · Crimson · Passion Red

HEX

#D53745

RGB

rgb(213, 55, 69)

HSL

hsl(355, 65%, 53%)

HSB

hsb(355, 74%, 84%)

CMYK

cmyk(0%, 74%, 68%, 16%)

Oklch

oklch(58.1% 0.194 21.1)

Traditional「Vermilion」· Paint「Passion Red」· Creative Blush Sunrise

#DB8E84

Peach Pink · DarkSalmon · Coral Red

HEX

#DB8E84

RGB

rgb(219, 142, 132)

HSL

hsl(7, 55%, 69%)

HSB

hsb(7, 40%, 86%)

CMYK

cmyk(0%, 35%, 40%, 14%)

Oklch

oklch(72.3% 0.096 27.7)

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

#E2DBC8

Goose Yellow · LightGray · Lemon Cream

HEX

#E2DBC8

RGB

rgb(226, 219, 200)

HSL

hsl(44, 31%, 84%)

HSB

hsb(44, 12%, 89%)

CMYK

cmyk(0%, 3%, 12%, 11%)

Oklch

oklch(89.2% 0.027 90.1)

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

#BEBB92

Fresh Green · Tan · Sunflower

HEX

#BEBB92

RGB

rgb(190, 187, 146)

HSL

hsl(56, 25%, 66%)

HSB

hsb(56, 23%, 75%)

CMYK

cmyk(0%, 2%, 23%, 25%)

Oklch

oklch(78.4% 0.056 104.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CCB5AD

ADC4CC

Analogous

CCADB5

CCB5AD

CCC4AD

Triadic

CCB5AD

ADCCB5

B5ADCC

Split-Comp.

CCB5AD

ADCCC4

ADB5CC

Tetradic

CCB5AD

B5CCAD

ADC4CC

C4ADCC

Contrast Matrix WCAG 2.1 Contrast

CCB5AD	D53745	DB8E84	E2DBC8	BEBB92
—	2.4 Fail	1.3 Fail	1.4 Fail	1.0 Fail
2.4 Fail	—	1.8 Fail	3.4 AA Large	2.4 Fail
1.3 Fail	1.8 Fail	—	1.9 Fail	1.3 Fail
1.4 Fail	3.4 AA Large	1.9 Fail	—	1.4 Fail
1.0 Fail	2.4 Fail	1.3 Fail	1.4 Fail	—

White BG

1.9Fail

4.7AA

2.6Fail

1.4Fail

2.0Fail

Black BG

10.8AAA

4.5AA Large

8.2AAA

15.2AAA

10.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C2C2AF

918F42

BAB986

DFDFCD

BDBD9C

Deuteranopia

C3C5AF

9AA641

BEC487

DFE0CE

BDBD9E

Tritanopia

CBB0B1

CD3F3E

D78889

E2D0D1

BEA4A5

Achromatopsia

BBBBBB

686868

A4A4A4

DBDBDB

B7B7B7

Shades & Tints Shades & Tints

#CCB5AD

Dark

Light

#D53745

Dark

Light

#DB8E84

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ccb5ad;
  --color-2: #d53745;
  --color-3: #db8e84;
  --color-4: #e2dbc8;
  --color-5: #bebb92;
}

SCSS

$color-1: #ccb5ad;
$color-2: #d53745;
$color-3: #db8e84;
$color-4: #e2dbc8;
$color-5: #bebb92;

TAILWIND

colors: {
  'brand-1': '#ccb5ad',
  'brand-2': '#d53745',
  'brand-3': '#db8e84',
  'brand-4': '#e2dbc8',
  'brand-5': '#bebb92',
}

RGB Array

[204, 181, 173], [213, 55, 69], [219, 142, 132], [226, 219, 200], [190, 187, 146]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #CCB5AD, #D53745, #DB8E84, #E2DBC8, #BEBB92 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: #ccb5ad; --color-2: #d53745; --color-3: #db8e84; --color-4: #e2dbc8; --color-5: #bebb92. 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