← Back to Editor

#2A0F12 · #A61718 · #B54B17 · #B58015 · #9BBF08

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

#2A0F12

Crimson · Black · Deep Berry

HEX
#2A0F12
RGB
rgb(42, 15, 18)
HSL
hsl(353, 47%, 11%)
HSB
hsb(353, 64%, 16%)
CMYK
cmyk(0%, 64%, 57%, 84%)
Oklch
oklch(21.2% 0.045 14.8)

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

#A61718

Vermilion · FireBrick · Wine Red

HEX
#A61718
RGB
rgb(166, 23, 24)
HSL
hsl(360, 76%, 37%)
HSB
hsb(360, 86%, 65%)
CMYK
cmyk(0%, 86%, 86%, 35%)
Oklch
oklch(46.6% 0.176 27.4)

Traditional「Vermilion」· Paint「Wine Red」· Creative Deep Ember

#B54B17

Tangerine · Sienna · Amber Brown

HEX
#B54B17
RGB
rgb(181, 75, 23)
HSL
hsl(20, 77%, 40%)
HSB
hsb(20, 87%, 71%)
CMYK
cmyk(0%, 59%, 87%, 29%)
Oklch
oklch(54.6% 0.150 42.6)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

#B58015

Ochre · DarkGoldenRod · Honey Gold

HEX
#B58015
RGB
rgb(181, 128, 21)
HSL
hsl(40, 79%, 40%)
HSB
hsb(40, 88%, 71%)
CMYK
cmyk(0%, 29%, 88%, 29%)
Oklch
oklch(63.7% 0.127 78.1)

Traditional「Ochre」· Paint「Honey Gold」· Creative Blush Sunrise

#9BBF08

Grass Green · DarkGoldenRod · Forest Green

HEX
#9BBF08
RGB
rgb(155, 191, 8)
HSL
hsl(72, 92%, 39%)
HSB
hsb(72, 96%, 75%)
CMYK
cmyk(19%, 0%, 96%, 25%)
Oklch
oklch(75.1% 0.181 122.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

2A0F12
0F2926

Analogous

290F1F
2A0F12
29190F

Triadic

2A0F12
12290F
0F1229

Split-Comp.

2A0F12
0F2919
0F1F29

Tetradic

2A0F12
1F290F
0F2926
190F29

Contrast Matrix WCAG 2.1 Contrast

2A0F12
A61718
B54B17
B58015
9BBF08
—
2.3
Fail
3.4
AA Large
5.2
AA
8.4
AAA
2.3
Fail
—
1.4
Fail
2.2
Fail
3.6
AA Large
3.4
AA Large
1.4
Fail
—
1.5
Fail
2.5
Fail
5.2
AA
2.2
Fail
1.5
Fail
—
1.6
Fail
8.4
AAA
3.6
AA Large
2.5
Fail
1.6
Fail
—
White BG
17.9AAA
7.6AAA
5.3AA
3.5AA Large
2.1Fail
Black BG
1.2Fail
2.8Fail
4.0AA Large
6.1AA
9.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

1E1E11
686718
878624
9E9E2F
ABAB34

Deuteranopia

202211
707B18
8D9527
A1A535
A9A63F

Tritanopia

291111
9F1818
B02E30
B24348
9D575F

Achromatopsia

171717
424242
656565
848484
9F9F9F

Shades & Tints Shades & Tints

#2A0F12

Dark
Light

#A61718

Dark
Light

#B54B17

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #2a0f12;
  --color-2: #a61718;
  --color-3: #b54b17;
  --color-4: #b58015;
  --color-5: #9bbf08;
}

SCSS

$color-1: #2a0f12;
$color-2: #a61718;
$color-3: #b54b17;
$color-4: #b58015;
$color-5: #9bbf08;

TAILWIND

colors: {
  'brand-1': '#2a0f12',
  'brand-2': '#a61718',
  'brand-3': '#b54b17',
  'brand-4': '#b58015',
  'brand-5': '#9bbf08',
}

RGB Array

[42, 15, 18], [166, 23, 24], [181, 75, 23], [181, 128, 21], [155, 191, 8]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #2A0F12, #A61718, #B54B17, #B58015, #9BBF08 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: #2a0f12; --color-2: #a61718; --color-3: #b54b17; --color-4: #b58015; --color-5: #9bbf08. 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