← Back to Editor

#FB1E00 · #E37F31 · #FFCE1C · #EAF1D2 · #9CE4FF

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

#FB1E00

Vermilion · Red · Passion Red

HEX
#FB1E00
RGB
rgb(251, 30, 0)
HSL
hsl(7, 100%, 49%)
HSB
hsb(7, 100%, 98%)
CMYK
cmyk(0%, 88%, 100%, 2%)
Oklch
oklch(62.8% 0.248 30.6)

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

#E37F31

Tangerine · Chocolate · Warm Sun

HEX
#E37F31
RGB
rgb(227, 127, 49)
HSL
hsl(26, 76%, 54%)
HSB
hsb(26, 78%, 89%)
CMYK
cmyk(0%, 44%, 78%, 11%)
Oklch
oklch(69.4% 0.151 54.2)

Traditional「Tangerine」· Paint「Warm Sun」· Creative Blush Sunrise

#FFCE1C

Ginger · Gold · Sunflower

HEX
#FFCE1C
RGB
rgb(255, 206, 28)
HSL
hsl(47, 100%, 55%)
HSB
hsb(47, 89%, 100%)
CMYK
cmyk(0%, 19%, 89%, 0%)
Oklch
oklch(87.0% 0.173 90.8)

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

#EAF1D2

Willow Green · Beige · Mint Green

HEX
#EAF1D2
RGB
rgb(234, 241, 210)
HSL
hsl(74, 53%, 88%)
HSB
hsb(74, 13%, 95%)
CMYK
cmyk(3%, 0%, 13%, 5%)
Oklch
oklch(94.5% 0.041 117.5)

Traditional「Willow Green」· Paint「Mint Green」· Creative Mint Breeze

#9CE4FF

Sky Blue · LightSkyBlue · Glacier Blue

HEX
#9CE4FF
RGB
rgb(156, 228, 255)
HSL
hsl(196, 100%, 81%)
HSB
hsb(196, 39%, 100%)
CMYK
cmyk(39%, 11%, 0%, 0%)
Oklch
oklch(88.1% 0.081 223.5)

Traditional「Sky Blue」· Paint「Glacier Blue」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FB1E00
00DDFA

Analogous

FA0060
FB1E00
FA9A00

Triadic

FB1E00
00FA1D
1D00FA

Split-Comp.

FB1E00
00FA9A
0060FA

Tetradic

FB1E00
60FA00
00DDFA
9A00FA

Contrast Matrix WCAG 2.1 Contrast

FB1E00
E37F31
FFCE1C
EAF1D2
9CE4FF
—
1.4
Fail
2.7
Fail
3.4
AA Large
2.8
Fail
1.4
Fail
—
1.9
Fail
2.5
Fail
2.0
Fail
2.7
Fail
1.9
Fail
—
1.3
Fail
1.1
Fail
3.4
AA Large
2.5
Fail
1.3
Fail
—
1.2
Fail
2.8
Fail
2.0
Fail
1.1
Fail
1.2
Fail
—
White BG
4.0AA Large
2.9Fail
1.5Fail
1.2Fail
1.4Fail
Black BG
5.3AA
7.3AAA
14.1AAA
18.0AAA
15.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

9B9907
B8B744
EAE947
EDEDDA
BBBCF8

Deuteranopia

A8B909
BEC548
EDF051
EDECDB
B7B2F7

Tritanopia

F00D0E
DE5356
FD6971
EADFE1
A0F3F2

Achromatopsia

5D5D5D
949494
C8C8C8
EBEBEB
D2D2D2

Shades & Tints Shades & Tints

#FB1E00

Dark
Light

#E37F31

Dark
Light

#FFCE1C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fb1e00;
  --color-2: #e37f31;
  --color-3: #ffce1c;
  --color-4: #eaf1d2;
  --color-5: #9ce4ff;
}

SCSS

$color-1: #fb1e00;
$color-2: #e37f31;
$color-3: #ffce1c;
$color-4: #eaf1d2;
$color-5: #9ce4ff;

TAILWIND

colors: {
  'brand-1': '#fb1e00',
  'brand-2': '#e37f31',
  'brand-3': '#ffce1c',
  'brand-4': '#eaf1d2',
  'brand-5': '#9ce4ff',
}

RGB Array

[251, 30, 0], [227, 127, 49], [255, 206, 28], [234, 241, 210], [156, 228, 255]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FB1E00, #E37F31, #FFCE1C, #EAF1D2, #9CE4FF is ideal for: social media posters, mobile apps, e-commerce promos, health products, baby brands, fresh-style blogs. 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: #fb1e00; --color-2: #e37f31; --color-3: #ffce1c; --color-4: #eaf1d2; --color-5: #9ce4ff. 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. 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