#FAEFF3 + #F8E6D6 + #E1E2D4 + #B3C8CD + #FAD2DD - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#FAEFF3

Rouge · SeaShell · Cherry Blossom

HEX

#FAEFF3

RGB

rgb(250, 239, 243)

HSL

hsl(338, 52%, 96%)

HSB

hsb(338, 4%, 98%)

CMYK

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

Oklch

oklch(96.2% 0.013 353.1)

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

#F8E6D6

Apricot · Beige · Peach Orange

HEX

#F8E6D6

RGB

rgb(248, 230, 214)

HSL

hsl(28, 71%, 91%)

HSB

hsb(28, 14%, 97%)

CMYK

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

Oklch

oklch(93.5% 0.029 64.1)

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

#E1E2D4

Fresh Green · LightGray · Lemon Cream

HEX

#E1E2D4

RGB

rgb(225, 226, 212)

HSL

hsl(64, 19%, 86%)

HSB

hsb(64, 6%, 89%)

CMYK

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

Oklch

oklch(90.8% 0.019 110.1)

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

#B3C8CD

Sky Blue · LightSteelBlue · Lake Green

HEX

#B3C8CD

RGB

rgb(179, 200, 205)

HSL

hsl(192, 21%, 75%)

HSB

hsb(192, 13%, 80%)

CMYK

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

Oklch

oklch(81.8% 0.024 213.6)

Traditional「Sky Blue」· Paint「Lake Green」· Creative Arctic Pool

#FAD2DD

Rouge · Pink · Cherry Blossom

HEX

#FAD2DD

RGB

rgb(250, 210, 221)

HSL

hsl(344, 80%, 90%)

HSB

hsb(344, 16%, 98%)

CMYK

cmyk(0%, 16%, 12%, 2%)

Oklch

oklch(90.1% 0.047 359.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FAEFF3

EFFAF6

Analogous

FAEFF9

FAEFF3

FAF1EF

Triadic

FAEFF3

F3FAEF

EFF3FA

Split-Comp.

FAEFF3

EFFAF1

EFF9FA

Tetradic

FAEFF3

F9FAEF

EFFAF6

F1EFFA

Contrast Matrix WCAG 2.1 Contrast

FAEFF3	F8E6D6	E1E2D4	B3C8CD	FAD2DD
—	1.1 Fail	1.2 Fail	1.6 Fail	1.2 Fail
1.1 Fail	—	1.1 Fail	1.4 Fail	1.1 Fail
1.2 Fail	1.1 Fail	—	1.3 Fail	1.0 Fail
1.6 Fail	1.4 Fail	1.3 Fail	—	1.3 Fail
1.2 Fail	1.1 Fail	1.0 Fail	1.3 Fail	—

White BG

1.1Fail

1.2Fail

1.3Fail

1.7Fail

1.4Fail

Black BG

18.7AAA

17.3AAA

16.0AAA

12.1AAA

15.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

F5F5F2

F0F0DA

E1E1D7

BCBCCC

E9E8DA

Deuteranopia

F6F7F2

F1F3DB

E1E1D8

BBB9CC

EBEEDA

Tritanopia

F9F1F1

F7DDDE

E1DADB

B4CBCB

F8D8D8

Achromatopsia

F3F3F3

EAEAEA

E0E0E0

C2C2C2

DFDFDF

Shades & Tints Shades & Tints

#FAEFF3

Dark

Light

#F8E6D6

Dark

Light

#E1E2D4

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #faeff3;
  --color-2: #f8e6d6;
  --color-3: #e1e2d4;
  --color-4: #b3c8cd;
  --color-5: #fad2dd;
}

SCSS

$color-1: #faeff3;
$color-2: #f8e6d6;
$color-3: #e1e2d4;
$color-4: #b3c8cd;
$color-5: #fad2dd;

TAILWIND

colors: {
  'brand-1': '#faeff3',
  'brand-2': '#f8e6d6',
  'brand-3': '#e1e2d4',
  'brand-4': '#b3c8cd',
  'brand-5': '#fad2dd',
}

RGB Array

[250, 239, 243], [248, 230, 214], [225, 226, 212], [179, 200, 205], [250, 210, 221]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FAEFF3, #F8E6D6, #E1E2D4, #B3C8CD, #FAD2DD 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: #faeff3; --color-2: #f8e6d6; --color-3: #e1e2d4; --color-4: #b3c8cd; --color-5: #fad2dd. 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