#CDDAB0 + #A78C72 + #D3D19F + #F5EEB8 + #FADAA4 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#CDDAB0

Willow Green · Silver · Apple Green

HEX

#CDDAB0

RGB

rgb(205, 218, 176)

HSL

hsl(79, 36%, 77%)

HSB

hsb(79, 19%, 85%)

CMYK

cmyk(6%, 0%, 19%, 15%)

Oklch

oklch(86.8% 0.058 121.6)

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

#A78C72

Tangerine · Gray · Warm Sun

HEX

#A78C72

RGB

rgb(167, 140, 114)

HSL

hsl(29, 23%, 55%)

HSB

hsb(29, 32%, 65%)

CMYK

cmyk(0%, 16%, 32%, 35%)

Oklch

oklch(65.8% 0.049 65.7)

Traditional「Tangerine」· Paint「Warm Sun」· Creative Blush Sunrise

#D3D19F

Fresh Green · Tan · Sunflower

HEX

#D3D19F

RGB

rgb(211, 209, 159)

HSL

hsl(58, 37%, 73%)

HSB

hsb(58, 25%, 83%)

CMYK

cmyk(0%, 1%, 25%, 17%)

Oklch

oklch(85.0% 0.066 105.8)

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

#F5EEB8

Fresh Green · Wheat · Lemon Cream

HEX

#F5EEB8

RGB

rgb(245, 238, 184)

HSL

hsl(53, 75%, 84%)

HSB

hsb(53, 25%, 96%)

CMYK

cmyk(0%, 3%, 25%, 4%)

Oklch

oklch(94.2% 0.070 101.5)

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

#FADAA4

Goose Yellow · Wheat · Peach Orange

HEX

#FADAA4

RGB

rgb(250, 218, 164)

HSL

hsl(38, 90%, 81%)

HSB

hsb(38, 34%, 98%)

CMYK

cmyk(0%, 13%, 34%, 2%)

Oklch

oklch(90.2% 0.078 80.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CDDAB0

BDAFD9

Analogous

D9D2AF

CDDAB0

B7D9AF

Triadic

CDDAB0

AFCCD9

D9AFCC

Split-Comp.

CDDAB0

AFB7D9

D2AFD9

Tetradic

CDDAB0

AFD9D2

BDAFD9

D9AFB7

Contrast Matrix WCAG 2.1 Contrast

CDDAB0	A78C72	D3D19F	F5EEB8	FADAA4
—	2.1 Fail	1.1 Fail	1.2 Fail	1.1 Fail
2.1 Fail	—	2.0 Fail	2.7 Fail	2.4 Fail
1.1 Fail	2.0 Fail	—	1.3 Fail	1.2 Fail
1.2 Fail	2.7 Fail	1.3 Fail	—	1.1 Fail
1.1 Fail	2.4 Fail	1.2 Fail	1.1 Fail	—

White BG

1.5Fail

3.2AA Large

1.6Fail

1.2Fail

1.3Fail

Black BG

14.3AAA

6.6AA

13.4AAA

17.8AAA

15.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D3D3BA

9B9B78

D2D2AB

F2F2C5

ECECB1

Deuteranopia

D2D1BD

9D9F7A

D2D2AE

F2F3C8

EEF0B4

Tritanopia

CEC2C4

A67D7E

D3B5B7

F5CFD2

F8BBBE

Achromatopsia

D1D1D1

919191

CCCCCC

EAEAEA

DDDDDD

Shades & Tints Shades & Tints

#CDDAB0

Dark

Light

#A78C72

Dark

Light

#D3D19F

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cddab0;
  --color-2: #a78c72;
  --color-3: #d3d19f;
  --color-4: #f5eeb8;
  --color-5: #fadaa4;
}

SCSS

$color-1: #cddab0;
$color-2: #a78c72;
$color-3: #d3d19f;
$color-4: #f5eeb8;
$color-5: #fadaa4;

TAILWIND

colors: {
  'brand-1': '#cddab0',
  'brand-2': '#a78c72',
  'brand-3': '#d3d19f',
  'brand-4': '#f5eeb8',
  'brand-5': '#fadaa4',
}

RGB Array

[205, 218, 176], [167, 140, 114], [211, 209, 159], [245, 238, 184], [250, 218, 164]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #CDDAB0, #A78C72, #D3D19F, #F5EEB8, #FADAA4 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: #cddab0; --color-2: #a78c72; --color-3: #d3d19f; --color-4: #f5eeb8; --color-5: #fadaa4. 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