← Back to Editor

#FFF2D8 · #FAE9CD · #F2DAC2 · #211414 · #E0C3B1

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarm

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#FFF2D8

Goose Yellow · Beige · Lemon Cream

HEX
#FFF2D8
RGB
rgb(255, 242, 216)
HSL
hsl(40, 100%, 92%)
HSB
hsb(40, 15%, 100%)
CMYK
cmyk(0%, 5%, 15%, 0%)
Oklch
oklch(96.5% 0.037 84.6)

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

#FAE9CD

Goose Yellow · Bisque · Peach Orange

HEX
#FAE9CD
RGB
rgb(250, 233, 205)
HSL
hsl(37, 82%, 89%)
HSB
hsb(37, 18%, 98%)
CMYK
cmyk(0%, 7%, 18%, 2%)
Oklch
oklch(94.0% 0.041 80.3)

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

#F2DAC2

Goose Yellow · Wheat · Peach Orange

HEX
#F2DAC2
RGB
rgb(242, 218, 194)
HSL
hsl(30, 65%, 85%)
HSB
hsb(30, 20%, 95%)
CMYK
cmyk(0%, 10%, 20%, 5%)
Oklch
oklch(90.2% 0.042 67.3)

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

#211414

Crimson · Black · Deep Berry

HEX
#211414
RGB
rgb(33, 20, 20)
HSL
hsl(0, 25%, 10%)
HSB
hsb(0, 39%, 13%)
CMYK
cmyk(0%, 39%, 39%, 87%)
Oklch
oklch(20.9% 0.022 19.0)

Traditional「Crimson」· Paint「Deep Berry」· Creative Blush Sunrise

#E0C3B1

Apricot · Wheat · Peach Orange

HEX
#E0C3B1
RGB
rgb(224, 195, 177)
HSL
hsl(23, 43%, 79%)
HSB
hsb(23, 21%, 88%)
CMYK
cmyk(0%, 13%, 21%, 12%)
Oklch
oklch(83.7% 0.041 53.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FFF2D8
D6E4FF

Analogous

FFDDD6
FFF2D8
F8FFD6

Triadic

FFF2D8
D6FFF1
F1D6FF

Split-Comp.

FFF2D8
D6F8FF
DDD6FF

Tetradic

FFF2D8
D6FFDD
D6E4FF
FFD6F8

Contrast Matrix WCAG 2.1 Contrast

FFF2D8
FAE9CD
F2DAC2
211414
E0C3B1
—
1.1
Fail
1.2
Fail
16.1
AAA
1.5
Fail
1.1
Fail
—
1.1
Fail
15.0
AAA
1.4
Fail
1.2
Fail
1.1
Fail
—
13.3
AAA
1.2
Fail
16.1
AAA
15.0
AAA
13.3
AAA
—
10.7
AAA
1.5
Fail
1.4
Fail
1.2
Fail
10.7
AAA
—
White BG
1.1Fail
1.2Fail
1.3Fail
17.9AAA
1.7Fail
Black BG
18.9AAA
17.6AAA
15.6AAA
1.2Fail
12.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

F9F9DE
F3F2D4
E8E7C8
1B1B14
D3D3B5

Deuteranopia

FAFBE0
F4F5D5
E9EBC9
1C1D14
D5D7B6

Tritanopia

FEE3E4
F9D9DA
F1CCCD
201414
DFB9BA

Achromatopsia

F3F3F3
EBEBEB
DEDEDE
181818
CACACA

Shades & Tints Shades & Tints

#FFF2D8

Dark
Light

#FAE9CD

Dark
Light

#F2DAC2

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fff2d8;
  --color-2: #fae9cd;
  --color-3: #f2dac2;
  --color-4: #211414;
  --color-5: #e0c3b1;
}

SCSS

$color-1: #fff2d8;
$color-2: #fae9cd;
$color-3: #f2dac2;
$color-4: #211414;
$color-5: #e0c3b1;

TAILWIND

colors: {
  'brand-1': '#fff2d8',
  'brand-2': '#fae9cd',
  'brand-3': '#f2dac2',
  'brand-4': '#211414',
  'brand-5': '#e0c3b1',
}

RGB Array

[255, 242, 216], [250, 233, 205], [242, 218, 194], [33, 20, 20], [224, 195, 177]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FFF2D8, #FAE9CD, #F2DAC2, #211414, #E0C3B1 is ideal for: social media posters, mobile apps, e-commerce promos, health products, baby brands, fresh-style blogs, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #fff2d8; --color-2: #fae9cd; --color-3: #f2dac2; --color-4: #211414; --color-5: #e0c3b1. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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 food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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