← Back to Editor

#C80B0F · #FF7200 · #FFC20F · #47645F · #222433

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

#C80B0F

Vermilion · FireBrick · Passion Red

HEX
#C80B0F
RGB
rgb(200, 11, 15)
HSL
hsl(359, 90%, 41%)
HSB
hsb(359, 95%, 78%)
CMYK
cmyk(0%, 95%, 93%, 22%)
Oklch
oklch(52.6% 0.211 28.3)

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

#FF7200

Tangerine · OrangeRed · Amber Brown

HEX
#FF7200
RGB
rgb(255, 114, 0)
HSL
hsl(27, 100%, 50%)
HSB
hsb(27, 100%, 100%)
CMYK
cmyk(0%, 55%, 100%, 0%)
Oklch
oklch(71.2% 0.195 47.5)

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

#FFC20F

Ginger · Gold · Sunflower

HEX
#FFC20F
RGB
rgb(255, 194, 15)
HSL
hsl(45, 100%, 53%)
HSB
hsb(45, 94%, 100%)
CMYK
cmyk(0%, 24%, 94%, 0%)
Oklch
oklch(84.6% 0.171 85.3)

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

#47645F

Mineral Blue · DarkSlateGray · Mint Ice

HEX
#47645F
RGB
rgb(71, 100, 95)
HSL
hsl(170, 17%, 34%)
HSB
hsb(170, 29%, 39%)
CMYK
cmyk(29%, 0%, 5%, 61%)
Oklch
oklch(47.9% 0.035 183.0)

Traditional「Mineral Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#222433

Indigo · DarkSlateGray · Deep Sea Blue

HEX
#222433
RGB
rgb(34, 36, 51)
HSL
hsl(233, 20%, 17%)
HSB
hsb(233, 33%, 20%)
CMYK
cmyk(33%, 29%, 0%, 80%)
Oklch
oklch(26.5% 0.028 278.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C80B0F
0AC7C4

Analogous

C70A6C
C80B0F
C7650A

Triadic

C80B0F
0EC70A
0A0EC7

Split-Comp.

C80B0F
0AC765
0A6CC7

Tetradic

C80B0F
6CC70A
0AC7C4
650AC7

Contrast Matrix WCAG 2.1 Contrast

C80B0F
FF7200
FFC20F
47645F
222433
—
2.2
Fail
3.7
AA Large
1.1
Fail
2.6
Fail
2.2
Fail
—
1.7
Fail
2.4
Fail
5.6
AA
3.7
AA Large
1.7
Fail
—
4.0
AA Large
9.5
AAA
1.1
Fail
2.4
Fail
4.0
AA Large
—
2.4
Fail
2.6
Fail
5.6
AA
9.5
AAA
2.4
Fail
—
White BG
6.0AA
2.7Fail
1.6Fail
6.4AA
15.3AAA
Black BG
3.5AA Large
7.7AAA
13.0AAA
3.3AA Large
1.4Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

76740E
C2C11C
E5E43A
545460
23232F

Deuteranopia

818F0E
CAD522
E8ED45
525061
23232E

Tritanopia

BF0D0D
F83136
FC5D64
486161
222D2C

Achromatopsia

444444
8F8F8F
C0C0C0
5B5B5B
252525

Shades & Tints Shades & Tints

#C80B0F

Dark
Light

#FF7200

Dark
Light

#FFC20F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c80b0f;
  --color-2: #ff7200;
  --color-3: #ffc20f;
  --color-4: #47645f;
  --color-5: #222433;
}

SCSS

$color-1: #c80b0f;
$color-2: #ff7200;
$color-3: #ffc20f;
$color-4: #47645f;
$color-5: #222433;

TAILWIND

colors: {
  'brand-1': '#c80b0f',
  'brand-2': '#ff7200',
  'brand-3': '#ffc20f',
  'brand-4': '#47645f',
  'brand-5': '#222433',
}

RGB Array

[200, 11, 15], [255, 114, 0], [255, 194, 15], [71, 100, 95], [34, 36, 51]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C80B0F, #FF7200, #FFC20F, #47645F, #222433 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: #c80b0f; --color-2: #ff7200; --color-3: #ffc20f; --color-4: #47645f; --color-5: #222433. 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