← Back to Editor

#BA0912 · #15181D · #F9A024 · #FD493D · #010864

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

#BA0912

Vermilion · FireBrick · Wine Red

HEX
#BA0912
RGB
rgb(186, 9, 18)
HSL
hsl(357, 91%, 38%)
HSB
hsb(357, 95%, 73%)
CMYK
cmyk(0%, 95%, 90%, 27%)
Oklch
oklch(49.9% 0.200 27.6)

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

#15181D

Indigo · Black · Deep Sea Blue

HEX
#15181D
RGB
rgb(21, 24, 29)
HSL
hsl(218, 16%, 10%)
HSB
hsb(218, 28%, 11%)
CMYK
cmyk(28%, 17%, 0%, 89%)
Oklch
oklch(20.8% 0.011 260.7)

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

#F9A024

Ginger · GoldenRod · Warm Sun

HEX
#F9A024
RGB
rgb(249, 160, 36)
HSL
hsl(35, 95%, 56%)
HSB
hsb(35, 86%, 98%)
CMYK
cmyk(0%, 36%, 86%, 2%)
Oklch
oklch(77.8% 0.162 68.0)

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

#FD493D

Peach Pink · Tomato · Coral Red

HEX
#FD493D
RGB
rgb(253, 73, 61)
HSL
hsl(4, 98%, 62%)
HSB
hsb(4, 76%, 99%)
CMYK
cmyk(0%, 71%, 76%, 1%)
Oklch
oklch(66.4% 0.218 28.4)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#010864

Indigo · Navy · Deep Sea Blue

HEX
#010864
RGB
rgb(1, 8, 100)
HSL
hsl(236, 98%, 20%)
HSB
hsb(236, 99%, 39%)
CMYK
cmyk(99%, 92%, 0%, 61%)
Oklch
oklch(23.8% 0.151 264.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

BA0912
09B9B0

Analogous

B9096A
BA0912
B95809

Triadic

BA0912
12B909
0912B9

Split-Comp.

BA0912
09B958
096AB9

Tetradic

BA0912
6AB909
09B9B0
5809B9

Contrast Matrix WCAG 2.1 Contrast

BA0912
15181D
F9A024
FD493D
010864
—
2.7
Fail
3.2
AA Large
2.0
Fail
2.6
Fail
2.7
Fail
—
8.5
AAA
5.3
AA
1.0
Fail
3.2
AA Large
8.5
AAA
—
1.6
Fail
8.3
AAA
2.0
Fail
5.3
AA
1.6
Fail
—
5.1
AA
2.6
Fail
1.0
Fail
8.3
AAA
5.1
AA
—
White BG
6.7AA
17.8AAA
2.1Fail
3.4AA Large
17.2AAA
Black BG
3.1AA Large
1.2Fail
10.1AAA
6.2AA
1.2Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

6D6C10
16161C
D2D242
AFAD40
04044E

Deuteranopia

78850F
16161B
D8DE49
BAC741
040348

Tritanopia

B10E0E
151B1B
F55A5F
F44243
013C38

Achromatopsia

3F3F3F
181818
ACACAC
7D7D7D
101010

Shades & Tints Shades & Tints

#BA0912

Dark
Light

#15181D

Dark
Light

#F9A024

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ba0912;
  --color-2: #15181d;
  --color-3: #f9a024;
  --color-4: #fd493d;
  --color-5: #010864;
}

SCSS

$color-1: #ba0912;
$color-2: #15181d;
$color-3: #f9a024;
$color-4: #fd493d;
$color-5: #010864;

TAILWIND

colors: {
  'brand-1': '#ba0912',
  'brand-2': '#15181d',
  'brand-3': '#f9a024',
  'brand-4': '#fd493d',
  'brand-5': '#010864',
}

RGB Array

[186, 9, 18], [21, 24, 29], [249, 160, 36], [253, 73, 61], [1, 8, 100]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #BA0912, #15181D, #F9A024, #FD493D, #010864 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: #ba0912; --color-2: #15181d; --color-3: #f9a024; --color-4: #fd493d; --color-5: #010864. 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