#F4EAD5 + #F4EBBD + #E7ECBD + #CFDDC4 + #C6E5D9 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#F4EAD5

Goose Yellow · Beige · Lemon Cream

HEX

#F4EAD5

RGB

rgb(244, 234, 213)

HSL

hsl(41, 58%, 90%)

HSB

hsb(41, 13%, 96%)

CMYK

cmyk(0%, 4%, 13%, 4%)

Oklch

oklch(93.9% 0.030 85.6)

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

#F4EBBD

Fresh Green · Bisque · Lemon Cream

HEX

#F4EBBD

RGB

rgb(244, 235, 189)

HSL

hsl(50, 71%, 85%)

HSB

hsb(50, 23%, 96%)

CMYK

cmyk(0%, 4%, 23%, 4%)

Oklch

oklch(93.6% 0.060 98.2)

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

#E7ECBD

Fresh Green · Wheat · Lemon Cream

HEX

#E7ECBD

RGB

rgb(231, 236, 189)

HSL

hsl(66, 55%, 83%)

HSB

hsb(66, 20%, 93%)

CMYK

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

Oklch

oklch(92.8% 0.062 112.5)

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

#CFDDC4

Celadon · LightGray · Mint Green

HEX

#CFDDC4

RGB

rgb(207, 221, 196)

HSL

hsl(94, 27%, 82%)

HSB

hsb(94, 11%, 87%)

CMYK

cmyk(6%, 0%, 11%, 13%)

Oklch

oklch(88.0% 0.037 131.2)

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

#C6E5D9

Jade · LightGray · Mint Green

HEX

#C6E5D9

RGB

rgb(198, 229, 217)

HSL

hsl(157, 37%, 84%)

HSB

hsb(157, 14%, 90%)

CMYK

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

Oklch

oklch(89.6% 0.036 170.1)

Traditional「Jade」· Paint「Mint Green」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F4EAD5

D7E0F4

Analogous

F4DCD7

F4EAD5

EFF4D7

Triadic

F4EAD5

D7F4EB

EBD7F4

Split-Comp.

F4EAD5

D7EFF4

DCD7F4

Tetradic

F4EAD5

D7F4DC

D7E0F4

F4D7EF

Contrast Matrix WCAG 2.1 Contrast

F4EAD5	F4EBBD	E7ECBD	CFDDC4	C6E5D9
—	1.0 Fail	1.0 Fail	1.2 Fail	1.1 Fail
1.0 Fail	—	1.0 Fail	1.2 Fail	1.1 Fail
1.0 Fail	1.0 Fail	—	1.2 Fail	1.1 Fail
1.2 Fail	1.2 Fail	1.2 Fail	—	1.1 Fail
1.1 Fail	1.1 Fail	1.1 Fail	1.1 Fail	—

White BG

1.2Fail

1.4Fail

1.3Fail

Black BG

17.6AAA

17.5AAA

17.1AAA

14.8AAA

15.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

F0F0DA

F0F0C8

E9E9C8

D5D5CA

D3D4DC

Deuteranopia

F0F1DB

F1F1CB

E9E9CB

D4D3CC

D2CFDD

Tritanopia

F3DEDF

F4D1D3

E7D1D3

D0CFD0

C8DEDF

Achromatopsia

EBEBEB

E8E8E8

E5E5E5

D6D6D6

DADADA

Shades & Tints Shades & Tints

#F4EAD5

Dark

Light

#F4EBBD

Dark

Light

#E7ECBD

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f4ead5;
  --color-2: #f4ebbd;
  --color-3: #e7ecbd;
  --color-4: #cfddc4;
  --color-5: #c6e5d9;
}

SCSS

$color-1: #f4ead5;
$color-2: #f4ebbd;
$color-3: #e7ecbd;
$color-4: #cfddc4;
$color-5: #c6e5d9;

TAILWIND

colors: {
  'brand-1': '#f4ead5',
  'brand-2': '#f4ebbd',
  'brand-3': '#e7ecbd',
  'brand-4': '#cfddc4',
  'brand-5': '#c6e5d9',
}

RGB Array

[244, 234, 213], [244, 235, 189], [231, 236, 189], [207, 221, 196], [198, 229, 217]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F4EAD5, #F4EBBD, #E7ECBD, #CFDDC4, #C6E5D9 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: #f4ead5; --color-2: #f4ebbd; --color-3: #e7ecbd; --color-4: #cfddc4; --color-5: #c6e5d9. 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