#CFDED4 + #F4F8E6 + #FDD6C2 + #E9EEE2 + #E0DAA8 · pastel - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

GentleSoothingSweetWarm

Industry INDUSTRY

Kids & BabyBeautyLifestyle

UI Context UI CONTEXT

E-commerceSocial PostIllustration

Color Details Color Details

#CFDED4

Celadon · LightGray · Mint Green

HEX

#CFDED4

RGB

rgb(207, 222, 212)

HSL

hsl(140, 19%, 84%)

HSB

hsb(140, 7%, 87%)

CMYK

cmyk(7%, 0%, 5%, 13%)

Oklch

oklch(88.6% 0.021 156.8)

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

#F4F8E6

Willow Green · Linen · Mint Green

HEX

#F4F8E6

RGB

rgb(244, 248, 230)

HSL

hsl(73, 56%, 94%)

HSB

hsb(73, 7%, 97%)

CMYK

cmyk(2%, 0%, 7%, 3%)

Oklch

oklch(97.1% 0.024 117.0)

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

#FDD6C2

Apricot · Bisque · Peach Orange

HEX

#FDD6C2

RGB

rgb(253, 214, 194)

HSL

hsl(20, 94%, 88%)

HSB

hsb(20, 23%, 99%)

CMYK

cmyk(0%, 15%, 23%, 1%)

Oklch

oklch(90.4% 0.051 48.8)

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

#E9EEE2

Willow Green · Beige · Mint Green

HEX

#E9EEE2

RGB

rgb(233, 238, 226)

HSL

hsl(85, 26%, 91%)

HSB

hsb(85, 5%, 93%)

CMYK

cmyk(2%, 0%, 5%, 7%)

Oklch

oklch(94.2% 0.017 125.3)

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

#E0DAA8

Fresh Green · Wheat · Lemon Cream

HEX

#E0DAA8

RGB

rgb(224, 218, 168)

HSL

hsl(54, 47%, 77%)

HSB

hsb(54, 25%, 88%)

CMYK

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

Oklch

oklch(88.1% 0.066 101.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CFDED4

DECED9

Analogous

D1DECE

CFDED4

CEDEDB

Triadic

CFDED4

D4CEDE

DED4CE

Split-Comp.

CFDED4

DBCEDE

DECED1

Tetradic

CFDED4

CED1DE

DECED9

DEDBCE

Contrast Matrix WCAG 2.1 Contrast

CFDED4	F4F8E6	FDD6C2	E9EEE2	E0DAA8
—	1.3 Fail	1.0 Fail	1.2 Fail	1.0 Fail
1.3 Fail	—	1.2 Fail	1.1 Fail	1.3 Fail
1.0 Fail	1.2 Fail	—	1.1 Fail	1.1 Fail
1.2 Fail	1.1 Fail	1.1 Fail	—	1.2 Fail
1.0 Fail	1.3 Fail	1.1 Fail	1.2 Fail	—

White BG

1.4Fail

1.1Fail

1.3Fail

1.2Fail

1.4Fail

Black BG

15.1AAA

19.4AAA

15.6AAA

17.8AAA

14.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D5D6D6

F6F6EA

ECECC7

EBEBE5

DDDDB4

Deuteranopia

D5D3D7

F6F5EB

EEF1C8

EBEBE6

DEDEB7

Tritanopia

D0D8D9

F4EEEF

FBCBCC

E9E7E8

E0BEC0

Achromatopsia

D8D8D8

F5F5F5

DFDFDF

EBEBEB

D6D6D6

Shades & Tints Shades & Tints

#CFDED4

Dark

Light

#F4F8E6

Dark

Light

#FDD6C2

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cfded4;
  --color-2: #f4f8e6;
  --color-3: #fdd6c2;
  --color-4: #e9eee2;
  --color-5: #e0daa8;
}

SCSS

$color-1: #cfded4;
$color-2: #f4f8e6;
$color-3: #fdd6c2;
$color-4: #e9eee2;
$color-5: #e0daa8;

TAILWIND

colors: {
  'brand-1': '#cfded4',
  'brand-2': '#f4f8e6',
  'brand-3': '#fdd6c2',
  'brand-4': '#e9eee2',
  'brand-5': '#e0daa8',
}

RGB Array

[207, 222, 212], [244, 248, 230], [253, 214, 194], [233, 238, 226], [224, 218, 168]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This pastel-style palette of #CFDED4, #F4F8E6, #FDD6C2, #E9EEE2, #E0DAA8 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: #cfded4; --color-2: #f4f8e6; --color-3: #fdd6c2; --color-4: #e9eee2; --color-5: #e0daa8. 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 pastel-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