#FFDDCC + #D5C0B7 + #CBA5A0 + #93766C + #B8E2B6 · cool - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#FFDDCC

Apricot · Bisque · Peach Orange

HEX

#FFDDCC

RGB

rgb(255, 221, 204)

HSL

hsl(20, 100%, 90%)

HSB

hsb(20, 20%, 100%)

CMYK

cmyk(0%, 13%, 20%, 0%)

Oklch

oklch(92.1% 0.044 48.2)

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

#D5C0B7

Apricot · Silver · Peach Orange

HEX

#D5C0B7

RGB

rgb(213, 192, 183)

HSL

hsl(18, 26%, 78%)

HSB

hsb(18, 14%, 84%)

CMYK

cmyk(0%, 10%, 14%, 16%)

Oklch

oklch(82.3% 0.027 44.7)

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

#CBA5A0

Peach Pink · Tan · Coral Red

HEX

#CBA5A0

RGB

rgb(203, 165, 160)

HSL

hsl(7, 29%, 71%)

HSB

hsb(7, 21%, 80%)

CMYK

cmyk(0%, 19%, 21%, 20%)

Oklch

oklch(75.5% 0.046 26.9)

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

#93766C

Tangerine · Gray · Amber Brown

HEX

#93766C

RGB

rgb(147, 118, 108)

HSL

hsl(15, 15%, 50%)

HSB

hsb(15, 27%, 58%)

CMYK

cmyk(0%, 20%, 27%, 42%)

Oklch

oklch(59.1% 0.040 39.9)

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

#B8E2B6

Celadon · Silver · Apple Green

HEX

#B8E2B6

RGB

rgb(184, 226, 182)

HSL

hsl(117, 43%, 80%)

HSB

hsb(117, 19%, 89%)

CMYK

cmyk(19%, 0%, 19%, 11%)

Oklch

oklch(87.1% 0.074 143.7)

Traditional「Celadon」· Paint「Apple Green」· Creative Mint Breeze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FFDDCC

CCEEFF

Analogous

FFCCD5

FFDDCC

FFF6CC

Triadic

FFDDCC

CCFFDD

DDCCFF

Split-Comp.

FFDDCC

CCFFF7

CCD4FF

Tetradic

FFDDCC

D5FFCC

CCEEFF

F6CCFF

Contrast Matrix WCAG 2.1 Contrast

FFDDCC	D5C0B7	CBA5A0	93766C	B8E2B6
—	1.4 Fail	1.7 Fail	3.3 AA Large	1.1 Fail
1.4 Fail	—	1.3 Fail	2.4 Fail	1.2 Fail
1.7 Fail	1.3 Fail	—	1.9 Fail	1.5 Fail
3.3 AA Large	2.4 Fail	1.9 Fail	—	2.9 Fail
1.1 Fail	1.2 Fail	1.5 Fail	2.9 Fail	—

White BG

1.3Fail

1.7Fail

2.2Fail

4.2AA Large

1.4Fail

Black BG

16.5AAA

12.1AAA

9.4AAA

5.0AA

14.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

F0F0D0

CCCCB9

BBBAA1

86866E

CACBC1

Deuteranopia

F2F5D1

CDCFBA

BDC0A2

888A6F

C8C5C3

Tritanopia

FDD3D4

D4BBBB

C9A2A2

927071

BAC9CB

Achromatopsia

E5E5E5

C5C5C5

B0B0B0

7E7E7E

D0D0D0

Shades & Tints Shades & Tints

#FFDDCC

Dark

Light

#D5C0B7

Dark

Light

#CBA5A0

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ffddcc;
  --color-2: #d5c0b7;
  --color-3: #cba5a0;
  --color-4: #93766c;
  --color-5: #b8e2b6;
}

SCSS

$color-1: #ffddcc;
$color-2: #d5c0b7;
$color-3: #cba5a0;
$color-4: #93766c;
$color-5: #b8e2b6;

TAILWIND

colors: {
  'brand-1': '#ffddcc',
  'brand-2': '#d5c0b7',
  'brand-3': '#cba5a0',
  'brand-4': '#93766c',
  'brand-5': '#b8e2b6',
}

RGB Array

[255, 221, 204], [213, 192, 183], [203, 165, 160], [147, 118, 108], [184, 226, 182]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #FFDDCC, #D5C0B7, #CBA5A0, #93766C, #B8E2B6 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: #ffddcc; --color-2: #d5c0b7; --color-3: #cba5a0; --color-4: #93766c; --color-5: #b8e2b6. 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 cool-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