#FCF9DD + #F6F2E5 + #F0EBED + #E9E4F4 + #E3DDFC - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#FCF9DD

Fresh Green · LightYellow · Lemon Cream

HEX

#FCF9DD

RGB

rgb(252, 249, 221)

HSL

hsl(54, 84%, 93%)

HSB

hsb(54, 12%, 99%)

CMYK

cmyk(0%, 1%, 12%, 1%)

Oklch

oklch(97.7% 0.037 102.0)

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

#F6F2E5

Goose Yellow · Linen · Lemon Cream

HEX

#F6F2E5

RGB

rgb(246, 242, 229)

HSL

hsl(46, 49%, 93%)

HSB

hsb(46, 7%, 96%)

CMYK

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

Oklch

oklch(96.1% 0.018 92.7)

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

#F0EBED

Rouge · Linen · Cherry Blossom

HEX

#F0EBED

RGB

rgb(240, 235, 237)

HSL

hsl(336, 14%, 93%)

HSB

hsb(336, 2%, 94%)

CMYK

cmyk(0%, 2%, 1%, 6%)

Oklch

oklch(94.5% 0.006 350.8)

Traditional「Rouge」· Paint「Cherry Blossom」· Creative Rose Petal

#E9E4F4

Wisteria · Lavender · Sky Blue

HEX

#E9E4F4

RGB

rgb(233, 228, 244)

HSL

hsl(259, 42%, 93%)

HSB

hsb(259, 7%, 96%)

CMYK

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

Oklch

oklch(92.7% 0.022 300.2)

Traditional「Wisteria」· Paint「Sky Blue」· Creative Lavender Dream

#E3DDFC

Wisteria · Lavender · Sky Blue

HEX

#E3DDFC

RGB

rgb(227, 221, 252)

HSL

hsl(252, 84%, 93%)

HSB

hsb(252, 12%, 99%)

CMYK

cmyk(10%, 12%, 0%, 1%)

Oklch

oklch(91.2% 0.042 294.4)

Traditional「Wisteria」· Paint「Sky Blue」· Creative Lavender Dream

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FCF9DD

DEE1FC

Analogous

FCEADE

FCF9DD

F0FCDE

Triadic

FCF9DD

DEFCF9

F9DEFC

Split-Comp.

FCF9DD

DEF0FC

EADEFC

Tetradic

FCF9DD

DEFCEA

DEE1FC

FCDEF0

Contrast Matrix WCAG 2.1 Contrast

FCF9DD	F6F2E5	F0EBED	E9E4F4	E3DDFC
—	1.1 Fail	1.1 Fail	1.2 Fail	1.2 Fail
1.1 Fail	—	1.1 Fail	1.1 Fail	1.2 Fail
1.1 Fail	1.1 Fail	—	1.1 Fail	1.1 Fail
1.2 Fail	1.1 Fail	1.1 Fail	—	1.1 Fail
1.2 Fail	1.2 Fail	1.1 Fail	1.1 Fail	—

White BG

1.1Fail

1.2Fail

1.3Fail

Black BG

19.7AAA

18.8AAA

17.8AAA

16.9AAA

16.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

FBFBE4

F4F4E8

EEEEED

E7E7F0

E0E0F4

Deuteranopia

FBFBE5

F5F5E9

EEEFEC

E7E8EF

E1E1F3

Tritanopia

FCE9EA

F6EBEB

F0ECEC

E9EDEC

E3EFED

Achromatopsia

F7F7F7

F2F2F2

EDEDED

E7E7E7

E2E2E2

Shades & Tints Shades & Tints

#FCF9DD

Dark

Light

#F6F2E5

Dark

Light

#F0EBED

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fcf9dd;
  --color-2: #f6f2e5;
  --color-3: #f0ebed;
  --color-4: #e9e4f4;
  --color-5: #e3ddfc;
}

SCSS

$color-1: #fcf9dd;
$color-2: #f6f2e5;
$color-3: #f0ebed;
$color-4: #e9e4f4;
$color-5: #e3ddfc;

TAILWIND

colors: {
  'brand-1': '#fcf9dd',
  'brand-2': '#f6f2e5',
  'brand-3': '#f0ebed',
  'brand-4': '#e9e4f4',
  'brand-5': '#e3ddfc',
}

RGB Array

[252, 249, 221], [246, 242, 229], [240, 235, 237], [233, 228, 244], [227, 221, 252]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FCF9DD, #F6F2E5, #F0EBED, #E9E4F4, #E3DDFC 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: #fcf9dd; --color-2: #f6f2e5; --color-3: #f0ebed; --color-4: #e9e4f4; --color-5: #e3ddfc. 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