← Back to Editor

#F67F00 · #E64B07 · #850302 · #082941 · #F23E22

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

#F67F00

Ochre · Orange · Amber Brown

HEX
#F67F00
RGB
rgb(246, 127, 0)
HSL
hsl(31, 100%, 48%)
HSB
hsb(31, 100%, 96%)
CMYK
cmyk(0%, 48%, 100%, 4%)
Oklch
oklch(71.8% 0.179 54.6)

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

#E64B07

Tangerine · OrangeRed · Amber Brown

HEX
#E64B07
RGB
rgb(230, 75, 7)
HSL
hsl(18, 94%, 46%)
HSB
hsb(18, 97%, 90%)
CMYK
cmyk(0%, 67%, 97%, 10%)
Oklch
oklch(62.4% 0.201 38.1)

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

#850302

Vermilion · Maroon · Wine Red

HEX
#850302
RGB
rgb(133, 3, 2)
HSL
hsl(0, 97%, 26%)
HSB
hsb(0, 98%, 52%)
CMYK
cmyk(0%, 98%, 98%, 48%)
Oklch
oklch(38.9% 0.157 29.2)

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

#082941

Lake Blue · MidnightBlue · Deep Sea Blue

HEX
#082941
RGB
rgb(8, 41, 65)
HSL
hsl(205, 78%, 14%)
HSB
hsb(205, 88%, 25%)
CMYK
cmyk(88%, 37%, 0%, 75%)
Oklch
oklch(27.1% 0.058 244.7)

Traditional「Lake Blue」· Paint「Deep Sea Blue」· Creative Blush Sunrise

#F23E22

Vermilion · OrangeRed · Passion Red

HEX
#F23E22
RGB
rgb(242, 62, 34)
HSL
hsl(8, 89%, 54%)
HSB
hsb(8, 86%, 95%)
CMYK
cmyk(0%, 74%, 86%, 5%)
Oklch
oklch(63.3% 0.220 31.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F67F00
0076F5

Analogous

F50400
F67F00
F1F500

Triadic

F67F00
00F57E
7E00F5

Split-Comp.

F67F00
00F1F5
0400F5

Tetradic

F67F00
00F504
0076F5
F500F1

Contrast Matrix WCAG 2.1 Contrast

F67F00
E64B07
850302
082941
F23E22
—
1.5
Fail
4.0
AA Large
5.7
AA
1.4
Fail
1.5
Fail
—
2.7
Fail
3.8
AA Large
1.0
Fail
4.0
AA Large
2.7
Fail
—
1.4
Fail
2.7
Fail
5.7
AA
3.8
AA Large
1.4
Fail
—
3.9
AA Large
1.4
Fail
1.0
Fail
2.7
Fail
3.9
AA Large
—
White BG
2.6Fail
3.9AA Large
10.4AAA
15.0AAA
3.8AA Large
Black BG
8.0AAA
5.4AA
2.0Fail
1.4Fail
5.5AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C2C11F
A3A117
4D4C02
16173B
A4A229

Deuteranopia

C9D226
ACB81B
545E02
14123A
AFBC2A

Tritanopia

F0373C
DE2427
7F0202
0A3736
E92E2F

Achromatopsia

949494
727272
2A2A2A
222222
717171

Shades & Tints Shades & Tints

#F67F00

Dark
Light

#E64B07

Dark
Light

#850302

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f67f00;
  --color-2: #e64b07;
  --color-3: #850302;
  --color-4: #082941;
  --color-5: #f23e22;
}

SCSS

$color-1: #f67f00;
$color-2: #e64b07;
$color-3: #850302;
$color-4: #082941;
$color-5: #f23e22;

TAILWIND

colors: {
  'brand-1': '#f67f00',
  'brand-2': '#e64b07',
  'brand-3': '#850302',
  'brand-4': '#082941',
  'brand-5': '#f23e22',
}

RGB Array

[246, 127, 0], [230, 75, 7], [133, 3, 2], [8, 41, 65], [242, 62, 34]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F67F00, #E64B07, #850302, #082941, #F23E22 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: #f67f00; --color-2: #e64b07; --color-3: #850302; --color-4: #082941; --color-5: #f23e22. 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 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