← Back to Editor

#9C240C · #FFB423 · #FFF04F · #F5BB0F · #FEF262

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

#9C240C

Vermilion · FireBrick · Wine Red

HEX
#9C240C
RGB
rgb(156, 36, 12)
HSL
hsl(10, 86%, 33%)
HSB
hsb(10, 92%, 61%)
CMYK
cmyk(0%, 77%, 92%, 39%)
Oklch
oklch(45.6% 0.159 32.8)

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

#FFB423

Ginger · Orange · Sunflower

HEX
#FFB423
RGB
rgb(255, 180, 35)
HSL
hsl(40, 100%, 57%)
HSB
hsb(40, 86%, 100%)
CMYK
cmyk(0%, 29%, 86%, 0%)
Oklch
oklch(82.1% 0.164 77.0)

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

#FFF04F

Fresh Green · Khaki · Sunflower

HEX
#FFF04F
RGB
rgb(255, 240, 79)
HSL
hsl(55, 100%, 65%)
HSB
hsb(55, 69%, 100%)
CMYK
cmyk(0%, 6%, 69%, 0%)
Oklch
oklch(94.0% 0.173 103.9)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

#F5BB0F

Ginger · Orange · Sunflower

HEX
#F5BB0F
RGB
rgb(245, 187, 15)
HSL
hsl(45, 92%, 51%)
HSB
hsb(45, 94%, 96%)
CMYK
cmyk(0%, 24%, 94%, 4%)
Oklch
oklch(82.2% 0.166 85.6)

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

#FEF262

Fresh Green · Khaki · Sunflower

HEX
#FEF262
RGB
rgb(254, 242, 98)
HSL
hsl(55, 99%, 69%)
HSB
hsb(55, 61%, 100%)
CMYK
cmyk(0%, 5%, 61%, 0%)
Oklch
oklch(94.5% 0.162 104.5)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

9C240C
0C849D

Analogous

9D0C3C
9C240C
9D6C0C

Triadic

9C240C
0C9D24
240C9D

Split-Comp.

9C240C
0C9D6C
0C3C9D

Tetradic

9C240C
3C9D0C
0C849D
6C0C9D

Contrast Matrix WCAG 2.1 Contrast

9C240C
FFB423
FFF04F
F5BB0F
FEF262
—
4.4
AA Large
6.7
AA
4.5
AA Large
6.8
AA
4.4
AA Large
—
1.5
Fail
1.0
Fail
1.5
Fail
6.7
AA
1.5
Fail
—
1.5
Fail
1.0
Fail
4.5
AA Large
1.0
Fail
1.5
Fail
—
1.5
Fail
6.8
AA
1.5
Fail
1.0
Fail
1.5
Fail
—
White BG
7.9AAA
1.8Fail
1.2Fail
1.8Fail
1.2Fail
Black BG
2.7Fail
11.8AAA
17.8AAA
12.0AAA
18.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

686712
DFDE46
F9F876
DCDB39
F9F985

Deuteranopia

6F7813
E3E94F
F9FB7F
DFE443
FAFA8D

Tritanopia

961617
FB6268
FE959B
F25961
FDA0A6

Achromatopsia

454545
BABABA
E2E2E2
B9B9B9
E5E5E5

Shades & Tints Shades & Tints

#9C240C

Dark
Light

#FFB423

Dark
Light

#FFF04F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #9c240c;
  --color-2: #ffb423;
  --color-3: #fff04f;
  --color-4: #f5bb0f;
  --color-5: #fef262;
}

SCSS

$color-1: #9c240c;
$color-2: #ffb423;
$color-3: #fff04f;
$color-4: #f5bb0f;
$color-5: #fef262;

TAILWIND

colors: {
  'brand-1': '#9c240c',
  'brand-2': '#ffb423',
  'brand-3': '#fff04f',
  'brand-4': '#f5bb0f',
  'brand-5': '#fef262',
}

RGB Array

[156, 36, 12], [255, 180, 35], [255, 240, 79], [245, 187, 15], [254, 242, 98]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #9C240C, #FFB423, #FFF04F, #F5BB0F, #FEF262 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: #9c240c; --color-2: #ffb423; --color-3: #fff04f; --color-4: #f5bb0f; --color-5: #fef262. 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 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