← Back to Editor

#FEA304 · #909320 · #125A44 · #37192C · #220315

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 AppData Visualization

Color Details Color Details

#FEA304

Ginger · Orange · Warm Sun

HEX
#FEA304
RGB
rgb(254, 163, 4)
HSL
hsl(38, 99%, 51%)
HSB
hsb(38, 98%, 100%)
CMYK
cmyk(0%, 36%, 98%, 0%)
Oklch
oklch(78.8% 0.170 69.8)

Traditional「Ginger」· Paint「Warm Sun」· Creative Blush Sunrise

#909320

Autumn Sage · Olive · Honey Gold

HEX
#909320
RGB
rgb(144, 147, 32)
HSL
hsl(62, 64%, 35%)
HSB
hsb(62, 78%, 58%)
CMYK
cmyk(2%, 0%, 78%, 42%)
Oklch
oklch(64.0% 0.130 111.1)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#125A44

Mineral Blue · DarkSlateGray · Peacock Green

HEX
#125A44
RGB
rgb(18, 90, 68)
HSL
hsl(162, 67%, 21%)
HSB
hsb(162, 80%, 35%)
CMYK
cmyk(80%, 0%, 24%, 65%)
Oklch
oklch(41.9% 0.078 167.5)

Traditional「Mineral Blue」· Paint「Peacock Green」· Creative Blush Sunrise

#37192C

Rose Purple · DarkSlateGray · Raspberry

HEX
#37192C
RGB
rgb(55, 25, 44)
HSL
hsl(322, 38%, 16%)
HSB
hsb(322, 55%, 22%)
CMYK
cmyk(0%, 55%, 20%, 78%)
Oklch
oklch(26.4% 0.056 342.9)

Traditional「Rose Purple」· Paint「Raspberry」· Creative Blush Sunrise

#220315

Rose Purple · Black · Raspberry

HEX
#220315
RGB
rgb(34, 3, 21)
HSL
hsl(325, 84%, 7%)
HSB
hsb(325, 91%, 13%)
CMYK
cmyk(0%, 91%, 38%, 87%)
Oklch
oklch(17.4% 0.062 347.9)

Traditional「Rose Purple」· Paint「Raspberry」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FEA304
0661FE

Analogous

FE2706
FEA304
DDFE06

Triadic

FEA304
06FEA3
A306FE

Split-Comp.

FEA304
06DDFE
2706FE

Tetradic

FEA304
06FE27
0661FE
FE06DD

Contrast Matrix WCAG 2.1 Contrast

FEA304
909320
125A44
37192C
220315
—
1.6
Fail
4.1
AA Large
7.8
AAA
9.6
AAA
1.6
Fail
—
2.5
Fail
4.8
AA
5.8
AA
4.1
AA Large
2.5
Fail
—
1.9
Fail
2.4
Fail
7.8
AAA
4.8
AA
1.9
Fail
—
1.2
Fail
9.6
AAA
5.8
AA
2.4
Fail
1.2
Fail
—
White BG
2.0Fail
3.3AA Large
8.2AAA
15.7AAA
19.2AAA
Black BG
10.5AAA
6.4AA
2.6Fail
1.3Fail
1.1Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

D7D62A
91913C
313249
2A2A27
151411

Deuteranopia

DCE334
919143
2D284B
2C2E26
161910

Tritanopia

F94950
905257
164E4E
362423
200D0C

Achromatopsia

ACACAC
858585
424242
242424
0E0E0E

Shades & Tints Shades & Tints

#FEA304

Dark
Light

#909320

Dark
Light

#125A44

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fea304;
  --color-2: #909320;
  --color-3: #125a44;
  --color-4: #37192c;
  --color-5: #220315;
}

SCSS

$color-1: #fea304;
$color-2: #909320;
$color-3: #125a44;
$color-4: #37192c;
$color-5: #220315;

TAILWIND

colors: {
  'brand-1': '#fea304',
  'brand-2': '#909320',
  'brand-3': '#125a44',
  'brand-4': '#37192c',
  'brand-5': '#220315',
}

RGB Array

[254, 163, 4], [144, 147, 32], [18, 90, 68], [55, 25, 44], [34, 3, 21]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FEA304, #909320, #125A44, #37192C, #220315 is ideal for: social media posters, mobile apps, e-commerce promos, tech websites, dark mode UIs, game UIs, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. 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: #fea304; --color-2: #909320; --color-3: #125a44; --color-4: #37192c; --color-5: #220315. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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