← Back to Editor

#FFC89B · #FDF1A7 · #F2E660 · #F3603E · #A92731

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

#FFC89B

Apricot · Wheat · Peach Orange

HEX
#FFC89B
RGB
rgb(255, 200, 155)
HSL
hsl(27, 100%, 80%)
HSB
hsb(27, 39%, 100%)
CMYK
cmyk(0%, 22%, 39%, 0%)
Oklch
oklch(87.1% 0.086 60.6)

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

#FDF1A7

Fresh Green · Wheat · Lemon Cream

HEX
#FDF1A7
RGB
rgb(253, 241, 167)
HSL
hsl(52, 96%, 82%)
HSB
hsb(52, 34%, 99%)
CMYK
cmyk(0%, 5%, 34%, 1%)
Oklch
oklch(95.1% 0.094 100.1)

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

#F2E660

Fresh Green · Khaki · Sunflower

HEX
#F2E660
RGB
rgb(242, 230, 96)
HSL
hsl(55, 85%, 66%)
HSB
hsb(55, 60%, 95%)
CMYK
cmyk(0%, 5%, 60%, 5%)
Oklch
oklch(91.0% 0.153 104.2)

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

#F3603E

Vermilion · Tomato · Passion Red

HEX
#F3603E
RGB
rgb(243, 96, 62)
HSL
hsl(11, 88%, 60%)
HSB
hsb(11, 74%, 95%)
CMYK
cmyk(0%, 60%, 74%, 5%)
Oklch
oklch(67.3% 0.188 34.4)

Traditional「Vermilion」· Paint「Passion Red」· Creative Blush Sunrise

#A92731

Vermilion · Brown · Passion Red

HEX
#A92731
RGB
rgb(169, 39, 49)
HSL
hsl(355, 63%, 41%)
HSB
hsb(355, 77%, 66%)
CMYK
cmyk(0%, 77%, 71%, 34%)
Oklch
oklch(48.6% 0.166 22.2)

Traditional「Vermilion」· Paint「Passion Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FFC89B
99D1FF

Analogous

FF999E
FFC89B
FFFA99

Triadic

FFC89B
99FFC7
C799FF

Split-Comp.

FFC89B
99FFFA
999EFF

Tetradic

FFC89B
9EFF99
99D1FF
FA99FF

Contrast Matrix WCAG 2.1 Contrast

FFC89B
FDF1A7
F2E660
F3603E
A92731
—
1.3
Fail
1.2
Fail
2.1
Fail
4.6
AA
1.3
Fail
—
1.1
Fail
2.8
Fail
6.1
AA
1.2
Fail
1.1
Fail
—
2.5
Fail
5.4
AA
2.1
Fail
2.8
Fail
2.5
Fail
—
2.2
Fail
4.6
AA
6.1
AA
5.4
AA
2.2
Fail
—
White BG
1.5Fail
1.1Fail
1.3Fail
3.2AA Large
7.0AA
Black BG
14.0AAA
18.3AAA
16.3AAA
6.6AA
3.0AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

E7E7A6
F8F8B9
EDED80
B3B246
71702F

Deuteranopia

EAEFA9
F9F9BD
EEEE88
BCC748
78822E

Tritanopia

FCAEB0
FCC7CA
F19AA0
EC4D4E
A22D2C

Achromatopsia

D3D3D3
ECECEC
DADADA
888888
4F4F4F

Shades & Tints Shades & Tints

#FFC89B

Dark
Light

#FDF1A7

Dark
Light

#F2E660

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ffc89b;
  --color-2: #fdf1a7;
  --color-3: #f2e660;
  --color-4: #f3603e;
  --color-5: #a92731;
}

SCSS

$color-1: #ffc89b;
$color-2: #fdf1a7;
$color-3: #f2e660;
$color-4: #f3603e;
$color-5: #a92731;

TAILWIND

colors: {
  'brand-1': '#ffc89b',
  'brand-2': '#fdf1a7',
  'brand-3': '#f2e660',
  'brand-4': '#f3603e',
  'brand-5': '#a92731',
}

RGB Array

[255, 200, 155], [253, 241, 167], [242, 230, 96], [243, 96, 62], [169, 39, 49]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FFC89B, #FDF1A7, #F2E660, #F3603E, #A92731 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: #ffc89b; --color-2: #fdf1a7; --color-3: #f2e660; --color-4: #f3603e; --color-5: #a92731. 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