#FBE3C7 + #FED7D0 + #D6D1CD + #A7DBB5 + #A2CEB3 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#FBE3C7

Goose Yellow · Bisque · Peach Orange

HEX

#FBE3C7

RGB

rgb(251, 227, 199)

HSL

hsl(32, 87%, 88%)

HSB

hsb(32, 21%, 98%)

CMYK

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

Oklch

oklch(92.8% 0.045 71.5)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

#FED7D0

Peach Pink · Bisque · Cherry Blossom

HEX

#FED7D0

RGB

rgb(254, 215, 208)

HSL

hsl(9, 96%, 91%)

HSB

hsb(9, 18%, 100%)

CMYK

cmyk(0%, 15%, 18%, 0%)

Oklch

oklch(91.0% 0.045 29.9)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Blush Sunrise

#D6D1CD

Apricot · LightGray · Peach Orange

HEX

#D6D1CD

RGB

rgb(214, 209, 205)

HSL

hsl(27, 10%, 82%)

HSB

hsb(27, 4%, 84%)

CMYK

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

Oklch

oklch(86.4% 0.008 61.4)

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

#A7DBB5

Celadon · Silver · Apple Green

HEX

#A7DBB5

RGB

rgb(167, 219, 181)

HSL

hsl(136, 42%, 76%)

HSB

hsb(136, 24%, 86%)

CMYK

cmyk(24%, 0%, 17%, 14%)

Oklch

oklch(84.5% 0.075 152.9)

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

#A2CEB3

Celadon · Silver · Apple Green

HEX

#A2CEB3

RGB

rgb(162, 206, 179)

HSL

hsl(143, 31%, 72%)

HSB

hsb(143, 21%, 81%)

CMYK

cmyk(21%, 0%, 13%, 19%)

Oklch

oklch(81.2% 0.060 157.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FBE3C7

C6DFFB

Analogous

FBC8C6

FBE3C7

F9FBC6

Triadic

FBE3C7

C6FBE2

E2C6FB

Split-Comp.

FBE3C7

C6F9FB

C8C6FB

Tetradic

FBE3C7

C6FBC8

C6DFFB

FBC6F9

Contrast Matrix WCAG 2.1 Contrast

FBE3C7	FED7D0	D6D1CD	A7DBB5	A2CEB3
—	1.1 Fail	1.2 Fail	1.3 Fail	1.4 Fail
1.1 Fail	—	1.1 Fail	1.2 Fail	1.3 Fail
1.2 Fail	1.1 Fail	—	1.0 Fail	1.2 Fail
1.3 Fail	1.2 Fail	1.0 Fail	—	1.1 Fail
1.4 Fail	1.3 Fail	1.2 Fail	1.1 Fail	—

White BG

1.2Fail

1.3Fail

1.5Fail

1.6Fail

1.7Fail

Black BG

16.9AAA

15.8AAA

13.9AAA

13.4AAA

12.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

F1F0CE

EDEDD2

D4D4CE

BEBEBE

B5B5BA

Deuteranopia

F2F4CF

EFF2D2

D4D4CE

BBB7C0

B3AFBB

Tritanopia

FAD3D4

FCD3D3

D6CFCF

AAC5C7

A4BFC0

Achromatopsia

E7E7E7

E2E2E2

D2D2D2

C7C7C7

BEBEBE

Shades & Tints Shades & Tints

#FBE3C7

Dark

Light

#FED7D0

Dark

Light

#D6D1CD

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fbe3c7;
  --color-2: #fed7d0;
  --color-3: #d6d1cd;
  --color-4: #a7dbb5;
  --color-5: #a2ceb3;
}

SCSS

$color-1: #fbe3c7;
$color-2: #fed7d0;
$color-3: #d6d1cd;
$color-4: #a7dbb5;
$color-5: #a2ceb3;

TAILWIND

colors: {
  'brand-1': '#fbe3c7',
  'brand-2': '#fed7d0',
  'brand-3': '#d6d1cd',
  'brand-4': '#a7dbb5',
  'brand-5': '#a2ceb3',
}

RGB Array

[251, 227, 199], [254, 215, 208], [214, 209, 205], [167, 219, 181], [162, 206, 179]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FBE3C7, #FED7D0, #D6D1CD, #A7DBB5, #A2CEB3 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: #fbe3c7; --color-2: #fed7d0; --color-3: #d6d1cd; --color-4: #a7dbb5; --color-5: #a2ceb3. 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