← Back to Editor

#EC1F00 · #F04B05 · #F08E05 · #FCB714 · #FCD614

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 App

Color Details Color Details

#EC1F00

Vermilion · Red · Passion Red

HEX
#EC1F00
RGB
rgb(236, 31, 0)
HSL
hsl(8, 100%, 46%)
HSB
hsb(8, 100%, 93%)
CMYK
cmyk(0%, 87%, 100%, 7%)
Oklch
oklch(60.1% 0.235 30.9)

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

#F04B05

Tangerine · OrangeRed · Amber Brown

HEX
#F04B05
RGB
rgb(240, 75, 5)
HSL
hsl(18, 96%, 48%)
HSB
hsb(18, 98%, 94%)
CMYK
cmyk(0%, 69%, 98%, 6%)
Oklch
oklch(64.1% 0.211 37.4)

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

#F08E05

Ochre · Orange · Amber Brown

HEX
#F08E05
RGB
rgb(240, 142, 5)
HSL
hsl(35, 96%, 48%)
HSB
hsb(35, 98%, 94%)
CMYK
cmyk(0%, 41%, 98%, 6%)
Oklch
oklch(73.5% 0.166 63.4)

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

#FCB714

Ginger · Orange · Sunflower

HEX
#FCB714
RGB
rgb(252, 183, 20)
HSL
hsl(42, 97%, 53%)
HSB
hsb(42, 92%, 99%)
CMYK
cmyk(0%, 27%, 92%, 1%)
Oklch
oklch(82.2% 0.167 80.6)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

#FCD614

Autumn Sage · Gold · Sunflower

HEX
#FCD614
RGB
rgb(252, 214, 20)
HSL
hsl(50, 97%, 53%)
HSB
hsb(50, 92%, 99%)
CMYK
cmyk(0%, 15%, 92%, 1%)
Oklch
oklch(88.2% 0.179 95.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

EC1F00
00CBEB

Analogous

EB0056
EC1F00
EB9500

Triadic

EC1F00
00EB1F
1F00EB

Split-Comp.

EC1F00
00EB95
0056EB

Tetradic

EC1F00
56EB00
00CBEB
9500EB

Contrast Matrix WCAG 2.1 Contrast

EC1F00
F04B05
F08E05
FCB714
FCD614
—
1.2
Fail
1.8
Fail
2.5
Fail
3.1
AA Large
1.2
Fail
—
1.5
Fail
2.1
Fail
2.6
Fail
1.8
Fail
1.5
Fail
—
1.4
Fail
1.7
Fail
2.5
Fail
2.1
Fail
1.4
Fail
—
1.2
Fail
3.1
AA Large
2.6
Fail
1.7
Fail
1.2
Fail
—
White BG
4.4AA Large
3.7AA Large
2.4Fail
1.8Fail
1.4Fail
Black BG
4.8AA
5.7AA
8.6AAA
11.9AAA
14.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

939108
A9A716
C6C526
DEDE3B
ECEB43

Deuteranopia

9FAF09
B2BF1A
CBD32E
E2E745
EEF14E

Tritanopia

E20D0F
E82326
EB4046
F95B61
FA6870

Achromatopsia

595959
747474
9C9C9C
B9B9B9
CBCBCB

Shades & Tints Shades & Tints

#EC1F00

Dark
Light

#F04B05

Dark
Light

#F08E05

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ec1f00;
  --color-2: #f04b05;
  --color-3: #f08e05;
  --color-4: #fcb714;
  --color-5: #fcd614;
}

SCSS

$color-1: #ec1f00;
$color-2: #f04b05;
$color-3: #f08e05;
$color-4: #fcb714;
$color-5: #fcd614;

TAILWIND

colors: {
  'brand-1': '#ec1f00',
  'brand-2': '#f04b05',
  'brand-3': '#f08e05',
  'brand-4': '#fcb714',
  'brand-5': '#fcd614',
}

RGB Array

[236, 31, 0], [240, 75, 5], [240, 142, 5], [252, 183, 20], [252, 214, 20]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #EC1F00, #F04B05, #F08E05, #FCB714, #FCD614 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: #ec1f00; --color-2: #f04b05; --color-3: #f08e05; --color-4: #fcb714; --color-5: #fcd614. 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