← Back to Editor

#1B0300 · #C90A02 · #FB2C0A · #B9A87D · #3E5158

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

#1B0300

Vermilion · Black · Deep Berry

HEX
#1B0300
RGB
rgb(27, 3, 0)
HSL
hsl(7, 100%, 5%)
HSB
hsb(7, 100%, 11%)
CMYK
cmyk(0%, 89%, 100%, 89%)
Oklch
oklch(14.9% 0.049 38.0)

Traditional「Vermilion」· Paint「Deep Berry」· Creative Blush Sunrise

#C90A02

Vermilion · FireBrick · Wine Red

HEX
#C90A02
RGB
rgb(201, 10, 2)
HSL
hsl(2, 98%, 40%)
HSB
hsb(2, 99%, 79%)
CMYK
cmyk(0%, 95%, 99%, 21%)
Oklch
oklch(52.7% 0.213 29.6)

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

#FB2C0A

Vermilion · OrangeRed · Passion Red

HEX
#FB2C0A
RGB
rgb(251, 44, 10)
HSL
hsl(8, 97%, 51%)
HSB
hsb(8, 96%, 98%)
CMYK
cmyk(0%, 82%, 96%, 2%)
Oklch
oklch(63.5% 0.241 31.3)

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

#B9A87D

Ginger · Tan · Sunflower

HEX
#B9A87D
RGB
rgb(185, 168, 125)
HSL
hsl(43, 30%, 61%)
HSB
hsb(43, 32%, 73%)
CMYK
cmyk(0%, 9%, 32%, 27%)
Oklch
oklch(73.6% 0.061 89.0)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#3E5158

Slate Blue · DarkSlateGray · Mint Ice

HEX
#3E5158
RGB
rgb(62, 81, 88)
HSL
hsl(196, 17%, 29%)
HSB
hsb(196, 30%, 35%)
CMYK
cmyk(30%, 8%, 0%, 65%)
Oklch
oklch(42.2% 0.026 222.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

1B0300
00171A

Analogous

1A000A
1B0300
1A1000

Triadic

1B0300
001A03
03001A

Split-Comp.

1B0300
001A10
000A1A

Tetradic

1B0300
0A1A00
00171A
10001A

Contrast Matrix WCAG 2.1 Contrast

1B0300
C90A02
FB2C0A
B9A87D
3E5158
—
3.3
AA Large
5.2
AA
8.5
AAA
2.4
Fail
3.3
AA Large
—
1.5
Fail
2.5
Fail
1.4
Fail
5.2
AA
1.5
Fail
—
1.6
Fail
2.2
Fail
8.5
AAA
2.5
Fail
1.6
Fail
—
3.6
AA Large
2.4
Fail
1.4
Fail
2.2
Fail
3.6
AA Large
—
White BG
19.8AAA
6.0AA
3.8AA Large
2.3Fail
8.3AAA
Black BG
1.1Fail
3.5AA Large
5.5AA
9.0AAA
2.5Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

111001
767504
A1A012
B2B187
464656

Deuteranopia

121401
819004
ADBD14
B3B48A
454456

Tritanopia

1A0101
BF0506
F1191A
B89091
3F5555

Achromatopsia

0A0A0A
424242
666666
A8A8A8
4C4C4C

Shades & Tints Shades & Tints

#1B0300

Dark
Light

#C90A02

Dark
Light

#FB2C0A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #1b0300;
  --color-2: #c90a02;
  --color-3: #fb2c0a;
  --color-4: #b9a87d;
  --color-5: #3e5158;
}

SCSS

$color-1: #1b0300;
$color-2: #c90a02;
$color-3: #fb2c0a;
$color-4: #b9a87d;
$color-5: #3e5158;

TAILWIND

colors: {
  'brand-1': '#1b0300',
  'brand-2': '#c90a02',
  'brand-3': '#fb2c0a',
  'brand-4': '#b9a87d',
  'brand-5': '#3e5158',
}

RGB Array

[27, 3, 0], [201, 10, 2], [251, 44, 10], [185, 168, 125], [62, 81, 88]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #1B0300, #C90A02, #FB2C0A, #B9A87D, #3E5158 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: #1b0300; --color-2: #c90a02; --color-3: #fb2c0a; --color-4: #b9a87d; --color-5: #3e5158. 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