← Back to Editor

#F0D784 · #ED1841 · #FA5021 · #ED9407 · #A7C2B8

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 App

Color Details Color Details

#F0D784

Goose Yellow · Khaki · Sunflower

HEX
#F0D784
RGB
rgb(240, 215, 132)
HSL
hsl(46, 78%, 73%)
HSB
hsb(46, 45%, 94%)
CMYK
cmyk(0%, 10%, 45%, 6%)
Oklch
oklch(88.2% 0.107 93.2)

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

#ED1841

Vermilion · Crimson · Passion Red

HEX
#ED1841
RGB
rgb(237, 24, 65)
HSL
hsl(348, 86%, 51%)
HSB
hsb(348, 90%, 93%)
CMYK
cmyk(0%, 90%, 73%, 7%)
Oklch
oklch(60.5% 0.234 20.3)

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

#FA5021

Vermilion · OrangeRed · Passion Red

HEX
#FA5021
RGB
rgb(250, 80, 33)
HSL
hsl(13, 96%, 55%)
HSB
hsb(13, 87%, 98%)
CMYK
cmyk(0%, 68%, 87%, 2%)
Oklch
oklch(66.4% 0.214 35.3)

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

#ED9407

Ochre · Orange · Amber Brown

HEX
#ED9407
RGB
rgb(237, 148, 7)
HSL
hsl(37, 94%, 48%)
HSB
hsb(37, 97%, 93%)
CMYK
cmyk(0%, 38%, 97%, 7%)
Oklch
oklch(74.1% 0.162 67.6)

Traditional「Ochre」· Paint「Amber Brown」· Creative Blush Sunrise

#A7C2B8

Jade · Silver · Apple Green

HEX
#A7C2B8
RGB
rgb(167, 194, 184)
HSL
hsl(158, 18%, 71%)
HSB
hsb(158, 14%, 76%)
CMYK
cmyk(14%, 0%, 5%, 24%)
Oklch
oklch(79.1% 0.032 171.1)

Traditional「Jade」· Paint「Apple Green」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F0D784
849EF0

Analogous

F0A184
F0D784
D3F084

Triadic

F0D784
84F0D7
D784F0

Split-Comp.

F0D784
84D3F0
A184F0

Tetradic

F0D784
84F0A1
849EF0
F084D3

Contrast Matrix WCAG 2.1 Contrast

F0D784
ED1841
FA5021
ED9407
A7C2B8
—
3.1
AA Large
2.4
Fail
1.7
Fail
1.3
Fail
3.1
AA Large
—
1.3
Fail
1.8
Fail
2.3
Fail
2.4
Fail
1.3
Fail
—
1.4
Fail
1.8
Fail
1.7
Fail
1.8
Fail
1.4
Fail
—
1.3
Fail
1.3
Fail
2.3
Fail
1.8
Fail
1.3
Fail
—
White BG
1.4Fail
4.4AA Large
3.4AA Large
2.4Fail
1.9Fail
Black BG
14.8AAA
4.8AA
6.2AA
8.8AAA
11.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E5E598
918F37
B0AF2C
C6C629
B3B3BA

Deuteranopia

E7E99D
9DAD35
BAC72F
CCD231
B1AFBB

Tritanopia

EFA8AB
E22F2E
F23537
E9444A
A8BCBD

Achromatopsia

D5D5D5
5C5C5C
7D7D7D
9F9F9F
B9B9B9

Shades & Tints Shades & Tints

#F0D784

Dark
Light

#ED1841

Dark
Light

#FA5021

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f0d784;
  --color-2: #ed1841;
  --color-3: #fa5021;
  --color-4: #ed9407;
  --color-5: #a7c2b8;
}

SCSS

$color-1: #f0d784;
$color-2: #ed1841;
$color-3: #fa5021;
$color-4: #ed9407;
$color-5: #a7c2b8;

TAILWIND

colors: {
  'brand-1': '#f0d784',
  'brand-2': '#ed1841',
  'brand-3': '#fa5021',
  'brand-4': '#ed9407',
  'brand-5': '#a7c2b8',
}

RGB Array

[240, 215, 132], [237, 24, 65], [250, 80, 33], [237, 148, 7], [167, 194, 184]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F0D784, #ED1841, #FA5021, #ED9407, #A7C2B8 is ideal for: social media posters, mobile apps, e-commerce promos. Vivid colors effectively attract user attention. 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: #f0d784; --color-2: #ed1841; --color-3: #fa5021; --color-4: #ed9407; --color-5: #a7c2b8. 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. 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