← Back to Editor

#0A51BE · #F9CA28 · #317B0C · #9C0F0F · #42217D

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

#0A51BE

Indigo · SteelBlue · Prussian Blue

HEX
#0A51BE
RGB
rgb(10, 81, 190)
HSL
hsl(216, 90%, 39%)
HSB
hsb(216, 95%, 75%)
CMYK
cmyk(95%, 57%, 0%, 25%)
Oklch
oklch(46.7% 0.183 260.2)

Traditional「Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

#F9CA28

Ginger · Gold · Sunflower

HEX
#F9CA28
RGB
rgb(249, 202, 40)
HSL
hsl(47, 95%, 57%)
HSB
hsb(47, 84%, 98%)
CMYK
cmyk(0%, 19%, 84%, 2%)
Oklch
oklch(85.6% 0.167 90.7)

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

#317B0C

Pine Green · ForestGreen · Forest Green

HEX
#317B0C
RGB
rgb(49, 123, 12)
HSL
hsl(100, 82%, 26%)
HSB
hsb(100, 90%, 48%)
CMYK
cmyk(60%, 0%, 90%, 52%)
Oklch
oklch(51.6% 0.155 138.4)

Traditional「Pine Green」· Paint「Forest Green」· Creative Blush Sunrise

#9C0F0F

Vermilion · DarkRed · Wine Red

HEX
#9C0F0F
RGB
rgb(156, 15, 15)
HSL
hsl(0, 82%, 34%)
HSB
hsb(0, 90%, 61%)
CMYK
cmyk(0%, 90%, 90%, 39%)
Oklch
oklch(44.1% 0.172 28.1)

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

#42217D

Deep Indigo · DarkSlateBlue · Eggplant

HEX
#42217D
RGB
rgb(66, 33, 125)
HSL
hsl(262, 58%, 31%)
HSB
hsb(262, 74%, 49%)
CMYK
cmyk(47%, 74%, 0%, 51%)
Oklch
oklch(35.1% 0.146 294.0)

Traditional「Deep Indigo」· Paint「Eggplant」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

0A51BE
BD750A

Analogous

0AABBD
0A51BE
1C0ABD

Triadic

0A51BE
BD0A52
52BD0A

Split-Comp.

0A51BE
BD1C0A
ABBD0A

Tetradic

0A51BE
BD0AAB
BD750A
0ABD1C

Contrast Matrix WCAG 2.1 Contrast

0A51BE
F9CA28
317B0C
9C0F0F
42217D
—
4.6
AA
1.4
Fail
1.2
Fail
1.7
Fail
4.6
AA
—
3.4
AA Large
5.4
AA
7.7
AAA
1.4
Fail
3.4
AA Large
—
1.6
Fail
2.3
Fail
1.2
Fail
5.4
AA
1.6
Fail
—
1.4
Fail
1.7
Fail
7.7
AAA
2.3
Fail
1.4
Fail
—
White BG
7.2AAA
1.6Fail
5.3AA
8.4AAA
12.0AAA
Black BG
2.9Fail
13.5AAA
4.0AA Large
2.5Fail
1.7Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

2929A4
E5E44F
515227
5F5E0F
343367

Deuteranopia

251F9D
E7EB59
4D472D
67720F
363861

Tritanopia

0E8F8A
F76E75
353C41
950F0F
405551

Achromatopsia

484848
C6C6C6
585858
393939
353535

Shades & Tints Shades & Tints

#0A51BE

Dark
Light

#F9CA28

Dark
Light

#317B0C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #0a51be;
  --color-2: #f9ca28;
  --color-3: #317b0c;
  --color-4: #9c0f0f;
  --color-5: #42217d;
}

SCSS

$color-1: #0a51be;
$color-2: #f9ca28;
$color-3: #317b0c;
$color-4: #9c0f0f;
$color-5: #42217d;

TAILWIND

colors: {
  'brand-1': '#0a51be',
  'brand-2': '#f9ca28',
  'brand-3': '#317b0c',
  'brand-4': '#9c0f0f',
  'brand-5': '#42217d',
}

RGB Array

[10, 81, 190], [249, 202, 40], [49, 123, 12], [156, 15, 15], [66, 33, 125]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #0A51BE, #F9CA28, #317B0C, #9C0F0F, #42217D 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: #0a51be; --color-2: #f9ca28; --color-3: #317b0c; --color-4: #9c0f0f; --color-5: #42217d. 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