#F5F3E6 + #D2C4AA + #DCECE9 + #EBDAE4 + #FCDCEB · pastel - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

GentleSoothingSweetWarmCool

Industry INDUSTRY

Kids & BabyBeautyLifestyle

UI Context UI CONTEXT

E-commerceSocial PostIllustration

Color Details Color Details

#F5F3E6

Fresh Green · Linen · Lemon Cream

HEX

#F5F3E6

RGB

rgb(245, 243, 230)

HSL

hsl(52, 43%, 93%)

HSB

hsb(52, 6%, 96%)

CMYK

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

Oklch

oklch(96.2% 0.017 99.6)

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

#D2C4AA

Goose Yellow · Silver · Warm Sun

HEX

#D2C4AA

RGB

rgb(210, 196, 170)

HSL

hsl(39, 31%, 75%)

HSB

hsb(39, 19%, 82%)

CMYK

cmyk(0%, 7%, 19%, 18%)

Oklch

oklch(82.5% 0.039 83.0)

Traditional「Goose Yellow」· Paint「Warm Sun」· Creative Honey Glow

#DCECE9

Jade · Lavender · Glacier Blue

HEX

#DCECE9

RGB

rgb(220, 236, 233)

HSL

hsl(169, 30%, 89%)

HSB

hsb(169, 7%, 93%)

CMYK

cmyk(7%, 0%, 1%, 7%)

Oklch

oklch(93.0% 0.017 183.5)

Traditional「Jade」· Paint「Glacier Blue」· Creative Arctic Pool

#EBDAE4

Mauve · Lavender · Cherry Blossom

HEX

#EBDAE4

RGB

rgb(235, 218, 228)

HSL

hsl(325, 30%, 89%)

HSB

hsb(325, 7%, 92%)

CMYK

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

Oklch

oklch(90.5% 0.023 341.4)

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

#FCDCEB

Rouge · Linen · Cherry Blossom

HEX

#FCDCEB

RGB

rgb(252, 220, 235)

HSL

hsl(332, 84%, 93%)

HSB

hsb(332, 13%, 99%)

CMYK

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

Oklch

oklch(92.5% 0.040 347.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F5F3E6

E5E8F5

Analogous

F5EBE5

F5F3E6

EFF5E5

Triadic

F5F3E6

E5F5F3

F3E5F5

Split-Comp.

F5F3E6

E5EFF5

EBE5F5

Tetradic

F5F3E6

E5F5EB

E5E8F5

F5E5EF

Contrast Matrix WCAG 2.1 Contrast

F5F3E6	D2C4AA	DCECE9	EBDAE4	FCDCEB
—	1.5 Fail	1.1 Fail	1.2 Fail	1.1 Fail
1.5 Fail	—	1.4 Fail	1.3 Fail	1.4 Fail
1.1 Fail	1.4 Fail	—	1.1 Fail	1.0 Fail
1.2 Fail	1.3 Fail	1.1 Fail	—	1.1 Fail
1.1 Fail	1.4 Fail	1.0 Fail	1.1 Fail	—

White BG

1.1Fail

1.7Fail

1.2Fail

1.3Fail

Black BG

18.8AAA

12.2AAA

17.2AAA

15.7AAA

16.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

F4F4E9

CCCCB0

E3E3EA

E4E3E2

EEEEE7

Deuteranopia

F4F4EA

CDCEB2

E2E1EA

E5E6E1

F0F2E7

Tritanopia

F5ECEC

D1B5B6

DDEAEA

EAE0DF

FAE5E4

Achromatopsia

F2F2F2

C5C5C5

E7E7E7

E0E0E0

E7E7E7

Shades & Tints Shades & Tints

#F5F3E6

Dark

Light

#D2C4AA

Dark

Light

#DCECE9

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f5f3e6;
  --color-2: #d2c4aa;
  --color-3: #dcece9;
  --color-4: #ebdae4;
  --color-5: #fcdceb;
}

SCSS

$color-1: #f5f3e6;
$color-2: #d2c4aa;
$color-3: #dcece9;
$color-4: #ebdae4;
$color-5: #fcdceb;

TAILWIND

colors: {
  'brand-1': '#f5f3e6',
  'brand-2': '#d2c4aa',
  'brand-3': '#dcece9',
  'brand-4': '#ebdae4',
  'brand-5': '#fcdceb',
}

RGB Array

[245, 243, 230], [210, 196, 170], [220, 236, 233], [235, 218, 228], [252, 220, 235]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This pastel-style palette of #F5F3E6, #D2C4AA, #DCECE9, #EBDAE4, #FCDCEB 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: #f5f3e6; --color-2: #d2c4aa; --color-3: #dcece9; --color-4: #ebdae4; --color-5: #fcdceb. 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