← Back to Editor

#FEA801 · #F97E02 · #B0361F · #7D2315 · #281B16

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

#FEA801

Ochre · Orange · Honey Gold

HEX
#FEA801
RGB
rgb(254, 168, 1)
HSL
hsl(40, 99%, 50%)
HSB
hsb(40, 100%, 100%)
CMYK
cmyk(0%, 34%, 100%, 0%)
Oklch
oklch(79.7% 0.170 72.5)

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

#F97E02

Ochre · Orange · Amber Brown

HEX
#F97E02
RGB
rgb(249, 126, 2)
HSL
hsl(30, 98%, 49%)
HSB
hsb(30, 99%, 98%)
CMYK
cmyk(0%, 49%, 99%, 2%)
Oklch
oklch(72.1% 0.182 53.4)

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

#B0361F

Vermilion · Brown · Passion Red

HEX
#B0361F
RGB
rgb(176, 54, 31)
HSL
hsl(10, 70%, 41%)
HSB
hsb(10, 82%, 69%)
CMYK
cmyk(0%, 69%, 82%, 31%)
Oklch
oklch(51.1% 0.162 32.8)

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

#7D2315

Vermilion · Maroon · Wine Red

HEX
#7D2315
RGB
rgb(125, 35, 21)
HSL
hsl(8, 71%, 29%)
HSB
hsb(8, 83%, 49%)
CMYK
cmyk(0%, 72%, 83%, 51%)
Oklch
oklch(39.8% 0.127 31.6)

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

#281B16

Tangerine · Black · Cinnamon

HEX
#281B16
RGB
rgb(40, 27, 22)
HSL
hsl(17, 29%, 12%)
HSB
hsb(17, 45%, 16%)
CMYK
cmyk(0%, 33%, 45%, 84%)
Oklch
oklch(23.7% 0.023 42.0)

Traditional「Tangerine」· Paint「Cinnamon」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FEA801
0155FE

Analogous

FE2B01
FEA801
D4FE01

Triadic

FEA801
01FEAA
AA01FE

Split-Comp.

FEA801
01D4FE
2B01FE

Tetradic

FEA801
01FE2B
0155FE
FE01D4

Contrast Matrix WCAG 2.1 Contrast

FEA801
F97E02
B0361F
7D2315
281B16
—
1.3
Fail
3.2
AA Large
5.1
AA
8.6
AAA
1.3
Fail
—
2.4
Fail
3.8
AA Large
6.4
AA
3.2
AA Large
2.4
Fail
—
1.6
Fail
2.7
Fail
5.1
AA
3.8
AA Large
1.6
Fail
—
1.7
Fail
8.6
AAA
6.4
AA
2.7
Fail
1.7
Fail
—
White BG
1.9Fail
2.6Fail
6.2AA
9.9AAA
16.7AAA
Black BG
10.8AAA
8.0AAA
3.4AA Large
2.1Fail
1.3Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

D9D829
C4C320
7B7A25
565518
222217

Deuteranopia

DEE433
CBD427
828B26
5B6219
232418

Tritanopia

FA4950
F3383D
AA292A
791B1C
271818

Achromatopsia

AFAFAF
959595
585858
3C3C3C
1E1E1E

Shades & Tints Shades & Tints

#FEA801

Dark
Light

#F97E02

Dark
Light

#B0361F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fea801;
  --color-2: #f97e02;
  --color-3: #b0361f;
  --color-4: #7d2315;
  --color-5: #281b16;
}

SCSS

$color-1: #fea801;
$color-2: #f97e02;
$color-3: #b0361f;
$color-4: #7d2315;
$color-5: #281b16;

TAILWIND

colors: {
  'brand-1': '#fea801',
  'brand-2': '#f97e02',
  'brand-3': '#b0361f',
  'brand-4': '#7d2315',
  'brand-5': '#281b16',
}

RGB Array

[254, 168, 1], [249, 126, 2], [176, 54, 31], [125, 35, 21], [40, 27, 22]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sunset-style palette of #FEA801, #F97E02, #B0361F, #7D2315, #281B16 is ideal for: social media posters, mobile apps, e-commerce promos, tech websites, dark mode UIs, game UIs. 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: #fea801; --color-2: #f97e02; --color-3: #b0361f; --color-4: #7d2315; --color-5: #281b16. 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?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. 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