#F8BEAB + #E2D4CA + #E2D7C1 + #D8DAC6 + #E6E2DA - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#F8BEAB

Apricot · LightPink · Peach Orange

HEX

#F8BEAB

RGB

rgb(248, 190, 171)

HSL

hsl(15, 85%, 82%)

HSB

hsb(15, 31%, 97%)

CMYK

cmyk(0%, 23%, 31%, 3%)

Oklch

oklch(84.9% 0.072 38.9)

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

#E2D4CA

Apricot · LightGray · Peach Orange

HEX

#E2D4CA

RGB

rgb(226, 212, 202)

HSL

hsl(25, 29%, 84%)

HSB

hsb(25, 11%, 89%)

CMYK

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

Oklch

oklch(87.9% 0.021 58.0)

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

#E2D7C1

Goose Yellow · LightGray · Lemon Cream

HEX

#E2D7C1

RGB

rgb(226, 215, 193)

HSL

hsl(40, 36%, 82%)

HSB

hsb(40, 15%, 89%)

CMYK

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

Oklch

oklch(88.2% 0.032 84.6)

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

#D8DAC6

Fresh Green · LightGray · Lemon Cream

HEX

#D8DAC6

RGB

rgb(216, 218, 198)

HSL

hsl(66, 21%, 82%)

HSB

hsb(66, 9%, 85%)

CMYK

cmyk(1%, 0%, 9%, 15%)

Oklch

oklch(88.1% 0.027 111.6)

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

#E6E2DA

Goose Yellow · Beige · Lemon Cream

HEX

#E6E2DA

RGB

rgb(230, 226, 218)

HSL

hsl(40, 19%, 88%)

HSB

hsb(40, 5%, 90%)

CMYK

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

Oklch

oklch(91.4% 0.012 84.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F8BEAB

AAE5F8

Analogous

F8AABE

F8BEAB

F8E5AA

Triadic

F8BEAB

AAF8BE

BEAAF8

Split-Comp.

F8BEAB

AAF8E5

AABEF8

Tetradic

F8BEAB

BEF8AA

AAE5F8

E5AAF8

Contrast Matrix WCAG 2.1 Contrast

F8BEAB	E2D4CA	E2D7C1	D8DAC6	E6E2DA
—	1.1 Fail	1.1 Fail	1.1 Fail	1.3 Fail
1.1 Fail	—	1.0 Fail	1.0 Fail	1.1 Fail
1.1 Fail	1.0 Fail	—	1.0 Fail	1.1 Fail
1.1 Fail	1.0 Fail	1.0 Fail	—	1.1 Fail
1.3 Fail	1.1 Fail	1.1 Fail	1.1 Fail	—

White BG

1.6Fail

1.4Fail

1.3Fail

Black BG

12.9AAA

14.5AAA

14.7AAA

14.8AAA

16.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

DFDEB0

DCDCCC

DDDDC6

D9D9CB

E4E4DC

Deuteranopia

E2E7B1

DDDECD

DEDFC8

D9D9CC

E5E5DC

Tritanopia

F5B3B4

E1CECF

E1CBCB

D8CFD0

E6DDDE

Achromatopsia

CDCDCD

D7D7D7

D8D8D8

D7D7D7

E2E2E2

Shades & Tints Shades & Tints

#F8BEAB

Dark

Light

#E2D4CA

Dark

Light

#E2D7C1

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f8beab;
  --color-2: #e2d4ca;
  --color-3: #e2d7c1;
  --color-4: #d8dac6;
  --color-5: #e6e2da;
}

SCSS

$color-1: #f8beab;
$color-2: #e2d4ca;
$color-3: #e2d7c1;
$color-4: #d8dac6;
$color-5: #e6e2da;

TAILWIND

colors: {
  'brand-1': '#f8beab',
  'brand-2': '#e2d4ca',
  'brand-3': '#e2d7c1',
  'brand-4': '#d8dac6',
  'brand-5': '#e6e2da',
}

RGB Array

[248, 190, 171], [226, 212, 202], [226, 215, 193], [216, 218, 198], [230, 226, 218]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F8BEAB, #E2D4CA, #E2D7C1, #D8DAC6, #E6E2DA 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: #f8beab; --color-2: #e2d4ca; --color-3: #e2d7c1; --color-4: #d8dac6; --color-5: #e6e2da. 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