#FFF8E3 + #F2F0D7 + #DAE6D0 + #DBC7C9 + #CA6180 · 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

#FFF8E3

Goose Yellow · LightYellow · Lemon Cream

HEX

#FFF8E3

RGB

rgb(255, 248, 227)

HSL

hsl(45, 100%, 95%)

HSB

hsb(45, 11%, 100%)

CMYK

cmyk(0%, 3%, 11%, 0%)

Oklch

oklch(97.9% 0.028 91.6)

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

#F2F0D7

Fresh Green · Beige · Lemon Cream

HEX

#F2F0D7

RGB

rgb(242, 240, 215)

HSL

hsl(56, 51%, 90%)

HSB

hsb(56, 11%, 95%)

CMYK

cmyk(0%, 1%, 11%, 5%)

Oklch

oklch(95.0% 0.033 103.3)

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

#DAE6D0

Celadon · LightGray · Mint Green

HEX

#DAE6D0

RGB

rgb(218, 230, 208)

HSL

hsl(93, 31%, 86%)

HSB

hsb(93, 10%, 90%)

CMYK

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

Oklch

oklch(91.0% 0.032 130.6)

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

#DBC7C9

Peach Pink · LightGray · Cherry Blossom

HEX

#DBC7C9

RGB

rgb(219, 199, 201)

HSL

hsl(354, 22%, 82%)

HSB

hsb(354, 9%, 86%)

CMYK

cmyk(0%, 9%, 8%, 14%)

Oklch

oklch(84.7% 0.023 10.7)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Rose Petal

#CA6180

Dark Violet · LightCoral · Rose Pink

HEX

#CA6180

RGB

rgb(202, 97, 128)

HSL

hsl(342, 50%, 59%)

HSB

hsb(342, 52%, 79%)

CMYK

cmyk(0%, 52%, 37%, 21%)

Oklch

oklch(62.7% 0.137 3.2)

Traditional「Dark Violet」· Paint「Rose Pink」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FFF8E3

E5ECFF

Analogous

FFECE5

FFF8E3

F9FFE5

Triadic

FFF8E3

E5FFF9

F9E5FF

Split-Comp.

FFF8E3

E5F9FF

ECE5FF

Tetradic

FFF8E3

E5FFEC

E5ECFF

FFE5F9

Contrast Matrix WCAG 2.1 Contrast

FFF8E3	F2F0D7	DAE6D0	DBC7C9	CA6180
—	1.1 Fail	1.2 Fail	1.5 Fail	3.6 AA Large
1.1 Fail	—	1.1 Fail	1.4 Fail	3.3 AA Large
1.2 Fail	1.1 Fail	—	1.2 Fail	2.9 Fail
1.5 Fail	1.4 Fail	1.2 Fail	—	2.4 Fail
3.6 AA Large	3.3 AA Large	2.9 Fail	2.4 Fail	—

White BG

1.1Fail

1.2Fail

1.3Fail

1.6Fail

3.8AA Large

Black BG

19.8AAA

18.2AAA

16.2AAA

13.0AAA

5.5AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

FCFCE8

F1F1DD

DFDFD5

D2D2C9

9D9C78

Deuteranopia

FCFDE9

F1F1DF

DFDED7

D4D5C8

A3AA77

Tritanopia

FFECED

F2E2E3

DBDADA

DAC8C8

C57371

Achromatopsia

F8F8F8

EEEEEE

E0E0E0

CDCDCD

848484

Shades & Tints Shades & Tints

#FFF8E3

Dark

Light

#F2F0D7

Dark

Light

#DAE6D0

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fff8e3;
  --color-2: #f2f0d7;
  --color-3: #dae6d0;
  --color-4: #dbc7c9;
  --color-5: #ca6180;
}

SCSS

$color-1: #fff8e3;
$color-2: #f2f0d7;
$color-3: #dae6d0;
$color-4: #dbc7c9;
$color-5: #ca6180;

TAILWIND

colors: {
  'brand-1': '#fff8e3',
  'brand-2': '#f2f0d7',
  'brand-3': '#dae6d0',
  'brand-4': '#dbc7c9',
  'brand-5': '#ca6180',
}

RGB Array

[255, 248, 227], [242, 240, 215], [218, 230, 208], [219, 199, 201], [202, 97, 128]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This pastel-style palette of #FFF8E3, #F2F0D7, #DAE6D0, #DBC7C9, #CA6180 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: #fff8e3; --color-2: #f2f0d7; --color-3: #dae6d0; --color-4: #dbc7c9; --color-5: #ca6180. 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