← Back to Editor

#F0150C · #F04C0C · #F0A80D · #82F00C · #0CF055

sunset

A 5-color sunset 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

#F0150C

Vermilion · Red · Passion Red

HEX
#F0150C
RGB
rgb(240, 21, 12)
HSL
hsl(2, 90%, 49%)
HSB
hsb(2, 95%, 94%)
CMYK
cmyk(0%, 91%, 95%, 6%)
Oklch
oklch(60.5% 0.241 29.3)

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

#F04C0C

Tangerine · OrangeRed · Amber Brown

HEX
#F04C0C
RGB
rgb(240, 76, 12)
HSL
hsl(17, 90%, 49%)
HSB
hsb(17, 95%, 94%)
CMYK
cmyk(0%, 68%, 95%, 6%)
Oklch
oklch(64.2% 0.210 37.2)

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

#F0A80D

Ochre · Orange · Honey Gold

HEX
#F0A80D
RGB
rgb(240, 168, 13)
HSL
hsl(41, 90%, 50%)
HSB
hsb(41, 95%, 94%)
CMYK
cmyk(0%, 30%, 95%, 6%)
Oklch
oklch(78.1% 0.161 77.4)

Traditional「Ochre」· Paint「Honey Gold」· Creative Blush Sunrise

#82F00C

Grass Green · Chartreuse · Olive Green

HEX
#82F00C
RGB
rgb(130, 240, 12)
HSL
hsl(89, 90%, 49%)
HSB
hsb(89, 95%, 94%)
CMYK
cmyk(46%, 0%, 95%, 6%)
Oklch
oklch(85.5% 0.247 134.7)

Traditional「Grass Green」· Paint「Olive Green」· Creative Blush Sunrise

#0CF055

Pine Green · LimeGreen · Olive Green

HEX
#0CF055
RGB
rgb(12, 240, 85)
HSL
hsl(139, 90%, 49%)
HSB
hsb(139, 95%, 94%)
CMYK
cmyk(95%, 0%, 65%, 6%)
Oklch
oklch(83.2% 0.250 146.3)

Traditional「Pine Green」· Paint「Olive Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F0150C
0CE6ED

Analogous

ED0C75
F0150C
ED840C

Triadic

F0150C
0CED14
140CED

Split-Comp.

F0150C
0CED84
0C75ED

Tetradic

F0150C
75ED0C
0CE6ED
840CED

Contrast Matrix WCAG 2.1 Contrast

F0150C
F04C0C
F0A80D
82F00C
0CF055
—
1.2
Fail
2.1
Fail
3.0
Fail
2.8
Fail
1.2
Fail
—
1.8
Fail
2.5
Fail
2.4
Fail
2.1
Fail
1.8
Fail
—
1.4
Fail
1.3
Fail
3.0
Fail
2.5
Fail
1.4
Fail
—
1.1
Fail
2.8
Fail
2.4
Fail
1.3
Fail
1.1
Fail
—
White BG
4.4AA Large
3.7AA Large
2.0Fail
1.5Fail
1.5Fail
Black BG
4.8AA
5.7AA
10.3AAA
14.4AAA
13.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

918F0E
A9A81B
D1D033
B2B343
6F717B

Deuteranopia

9EAE0F
B3BF1F
D5DA3C
ABA350
625084

Tritanopia

E51010
E8282A
EC5057
886F78
17989F

Achromatopsia

555555
767676
ACACAC
B5B5B5
9A9A9A

Shades & Tints Shades & Tints

#F0150C

Dark
Light

#F04C0C

Dark
Light

#F0A80D

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f0150c;
  --color-2: #f04c0c;
  --color-3: #f0a80d;
  --color-4: #82f00c;
  --color-5: #0cf055;
}

SCSS

$color-1: #f0150c;
$color-2: #f04c0c;
$color-3: #f0a80d;
$color-4: #82f00c;
$color-5: #0cf055;

TAILWIND

colors: {
  'brand-1': '#f0150c',
  'brand-2': '#f04c0c',
  'brand-3': '#f0a80d',
  'brand-4': '#82f00c',
  'brand-5': '#0cf055',
}

RGB Array

[240, 21, 12], [240, 76, 12], [240, 168, 13], [130, 240, 12], [12, 240, 85]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sunset-style palette of #F0150C, #F04C0C, #F0A80D, #82F00C, #0CF055 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: #f0150c; --color-2: #f04c0c; --color-3: #f0a80d; --color-4: #82f00c; --color-5: #0cf055. 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 sunset-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