← Back to Editor

#FFE3C5 · #EED642 · #2D3122 · #F45657 · #B0D0F9

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarmCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#FFE3C5

Goose Yellow · Bisque · Peach Orange

HEX
#FFE3C5
RGB
rgb(255, 227, 197)
HSL
hsl(31, 100%, 89%)
HSB
hsb(31, 23%, 100%)
CMYK
cmyk(0%, 11%, 23%, 0%)
Oklch
oklch(93.1% 0.050 69.1)

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

#EED642

Autumn Sage · SandyBrown · Sunflower

HEX
#EED642
RGB
rgb(238, 214, 66)
HSL
hsl(52, 83%, 60%)
HSB
hsb(52, 72%, 93%)
CMYK
cmyk(0%, 10%, 72%, 7%)
Oklch
oklch(87.1% 0.161 99.7)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

#2D3122

Grass Green · DarkSlateGray · Dark Green

HEX
#2D3122
RGB
rgb(45, 49, 34)
HSL
hsl(76, 18%, 16%)
HSB
hsb(76, 31%, 19%)
CMYK
cmyk(8%, 0%, 31%, 81%)
Oklch
oklch(30.4% 0.026 120.1)

Traditional「Grass Green」· Paint「Dark Green」· Creative Blush Sunrise

#F45657

Peach Pink · Tomato · Coral Red

HEX
#F45657
RGB
rgb(244, 86, 87)
HSL
hsl(360, 88%, 65%)
HSB
hsb(360, 65%, 96%)
CMYK
cmyk(0%, 65%, 64%, 4%)
Oklch
oklch(66.6% 0.194 23.7)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Soft Aurora

#B0D0F9

Azure · LightBlue · Sky Blue

HEX
#B0D0F9
RGB
rgb(176, 208, 249)
HSL
hsl(214, 86%, 83%)
HSB
hsb(214, 29%, 98%)
CMYK
cmyk(29%, 16%, 0%, 2%)
Oklch
oklch(84.8% 0.067 254.8)

Traditional「Azure」· Paint「Sky Blue」· Creative Twilight Haze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FFE3C5
C7E2FF

Analogous

FFC8C7
FFE3C5
FEFFC7

Triadic

FFE3C5
C7FFE4
E4C7FF

Split-Comp.

FFE3C5
C7FEFF
C8C7FF

Tetradic

FFE3C5
C7FFC8
C7E2FF
FFC7FE

Contrast Matrix WCAG 2.1 Contrast

FFE3C5
EED642
2D3122
F45657
B0D0F9
—
1.2
Fail
10.8
AAA
2.7
Fail
1.3
Fail
1.2
Fail
—
9.1
AAA
2.3
Fail
1.1
Fail
10.8
AAA
9.1
AAA
—
4.0
AA Large
8.4
AAA
2.7
Fail
2.3
Fail
4.0
AA Large
—
2.1
Fail
1.3
Fail
1.1
Fail
8.4
AAA
2.1
Fail
—
White BG
1.2Fail
1.5Fail
13.3AAA
3.3AA Large
1.6Fail
Black BG
17.0AAA
14.3AAA
1.6Fail
6.3AA
13.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

F3F3CC
E4E366
2F2F26
B0AE57
BEBEEF

Deuteranopia

F5F7CE
E5E76E
2F2E27
B9C557
BCBAED

Tritanopia

FED2D3
ED8288
2D2829
EC5757
B2E7E6

Achromatopsia

E8E8E8
CCCCCC
2E2E2E
858585
CBCBCB

Shades & Tints Shades & Tints

#FFE3C5

Dark
Light

#EED642

Dark
Light

#2D3122

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ffe3c5;
  --color-2: #eed642;
  --color-3: #2d3122;
  --color-4: #f45657;
  --color-5: #b0d0f9;
}

SCSS

$color-1: #ffe3c5;
$color-2: #eed642;
$color-3: #2d3122;
$color-4: #f45657;
$color-5: #b0d0f9;

TAILWIND

colors: {
  'brand-1': '#ffe3c5',
  'brand-2': '#eed642',
  'brand-3': '#2d3122',
  'brand-4': '#f45657',
  'brand-5': '#b0d0f9',
}

RGB Array

[255, 227, 197], [238, 214, 66], [45, 49, 34], [244, 86, 87], [176, 208, 249]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FFE3C5, #EED642, #2D3122, #F45657, #B0D0F9 is ideal for: social media posters, mobile apps, e-commerce promos, 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: #ffe3c5; --color-2: #eed642; --color-3: #2d3122; --color-4: #f45657; --color-5: #b0d0f9. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. 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