← Back to Editor

#F5E3BF · #FFCCA1 · #F19377 · #C8AD14 · #2D2753

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

#F5E3BF

Goose Yellow · Bisque · Lemon Cream

HEX
#F5E3BF
RGB
rgb(245, 227, 191)
HSL
hsl(40, 73%, 85%)
HSB
hsb(40, 22%, 96%)
CMYK
cmyk(0%, 7%, 22%, 4%)
Oklch
oklch(92.1% 0.051 84.5)

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

#FFCCA1

Apricot · Wheat · Peach Orange

HEX
#FFCCA1
RGB
rgb(255, 204, 161)
HSL
hsl(27, 100%, 82%)
HSB
hsb(27, 37%, 100%)
CMYK
cmyk(0%, 20%, 37%, 0%)
Oklch
oklch(88.0% 0.081 61.6)

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

#F19377

Peach Pink · DarkSalmon · Coral Red

HEX
#F19377
RGB
rgb(241, 147, 119)
HSL
hsl(14, 81%, 71%)
HSB
hsb(14, 51%, 95%)
CMYK
cmyk(0%, 39%, 51%, 5%)
Oklch
oklch(75.5% 0.121 37.4)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#C8AD14

Autumn Sage · GoldenRod · Honey Gold

HEX
#C8AD14
RGB
rgb(200, 173, 20)
HSL
hsl(51, 82%, 43%)
HSB
hsb(51, 90%, 78%)
CMYK
cmyk(0%, 13%, 90%, 22%)
Oklch
oklch(74.9% 0.151 97.5)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#2D2753

Deep Indigo · MidnightBlue · Prussian Blue

HEX
#2D2753
RGB
rgb(45, 39, 83)
HSL
hsl(248, 36%, 24%)
HSB
hsb(248, 53%, 33%)
CMYK
cmyk(46%, 53%, 0%, 67%)
Oklch
oklch(30.4% 0.077 287.1)

Traditional「Deep Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F5E3BF
BDCFF5

Analogous

F5C6BD
F5E3BF
EBF5BD

Triadic

F5E3BF
BDF5E2
E2BDF5

Split-Comp.

F5E3BF
BDEBF5
C6BDF5

Tetradic

F5E3BF
BDF5C6
BDCFF5
F5BDEB

Contrast Matrix WCAG 2.1 Contrast

F5E3BF
FFCCA1
F19377
C8AD14
2D2753
—
1.2
Fail
1.8
Fail
1.8
Fail
10.9
AAA
1.2
Fail
—
1.6
Fail
1.5
Fail
9.4
AAA
1.8
Fail
1.6
Fail
—
1.0
Fail
6.0
AA
1.8
Fail
1.5
Fail
1.0
Fail
—
6.2
AA
10.9
AAA
9.4
AAA
6.0
AA
6.2
AA
—
White BG
1.3Fail
1.5Fail
2.3Fail
2.2Fail
13.8AAA
Black BG
16.6AAA
14.4AAA
9.2AAA
9.4AAA
1.5Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

EDEDC8
E9E8AB
C8C77E
BCBC39
2A2A48

Deuteranopia

EEF0CA
ECF0AE
CED57F
BEC042
2B2B46

Tritanopia

F4CFD0
FCB4B5
EC8384
C7565D
2D403E

Achromatopsia

E4E4E4
D6D6D6
ACACAC
A4A4A4
2E2E2E

Shades & Tints Shades & Tints

#F5E3BF

Dark
Light

#FFCCA1

Dark
Light

#F19377

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f5e3bf;
  --color-2: #ffcca1;
  --color-3: #f19377;
  --color-4: #c8ad14;
  --color-5: #2d2753;
}

SCSS

$color-1: #f5e3bf;
$color-2: #ffcca1;
$color-3: #f19377;
$color-4: #c8ad14;
$color-5: #2d2753;

TAILWIND

colors: {
  'brand-1': '#f5e3bf',
  'brand-2': '#ffcca1',
  'brand-3': '#f19377',
  'brand-4': '#c8ad14',
  'brand-5': '#2d2753',
}

RGB Array

[245, 227, 191], [255, 204, 161], [241, 147, 119], [200, 173, 20], [45, 39, 83]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F5E3BF, #FFCCA1, #F19377, #C8AD14, #2D2753 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: #f5e3bf; --color-2: #ffcca1; --color-3: #f19377; --color-4: #c8ad14; --color-5: #2d2753. 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