← Back to Editor

#0B1D12 · #1A4519 · #5C6324 · #FE7236 · #F70F10

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

Color Details Color Details

#0B1D12

Celadon · Black · Dark Green

HEX
#0B1D12
RGB
rgb(11, 29, 18)
HSL
hsl(143, 45%, 8%)
HSB
hsb(143, 62%, 11%)
CMYK
cmyk(62%, 0%, 38%, 89%)
Oklch
oklch(21.1% 0.033 155.5)

Traditional「Celadon」· Paint「Dark Green」· Creative Blush Sunrise

#1A4519

Celadon · DarkGreen · Dark Green

HEX
#1A4519
RGB
rgb(26, 69, 25)
HSL
hsl(119, 47%, 18%)
HSB
hsb(119, 64%, 27%)
CMYK
cmyk(62%, 0%, 64%, 73%)
Oklch
oklch(34.8% 0.086 143.1)

Traditional「Celadon」· Paint「Dark Green」· Creative Blush Sunrise

#5C6324

Autumn Sage · DarkOliveGreen · Honey Gold

HEX
#5C6324
RGB
rgb(92, 99, 36)
HSL
hsl(67, 47%, 26%)
HSB
hsb(67, 64%, 39%)
CMYK
cmyk(7%, 0%, 64%, 61%)
Oklch
oklch(48.0% 0.086 115.0)

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

#FE7236

Tangerine · Tomato · Warm Sun

HEX
#FE7236
RGB
rgb(254, 114, 54)
HSL
hsl(18, 99%, 60%)
HSB
hsb(18, 79%, 100%)
CMYK
cmyk(0%, 55%, 79%, 0%)
Oklch
oklch(71.3% 0.186 41.7)

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

#F70F10

Vermilion · Red · Passion Red

HEX
#F70F10
RGB
rgb(247, 15, 16)
HSL
hsl(360, 94%, 51%)
HSB
hsb(360, 94%, 97%)
CMYK
cmyk(0%, 94%, 94%, 3%)
Oklch
oklch(61.6% 0.248 28.7)

Traditional「Vermilion」· Paint「Passion Red」· Creative Soft Aurora

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

0B1D12
1E0B17

Analogous

0D1E0B
0B1D12
0B1E1B

Triadic

0B1D12
120B1E
1E120B

Split-Comp.

0B1D12
1B0B1E
1E0B0D

Tetradic

0B1D12
0B0D1E
1E0B17
1E1B0B

Contrast Matrix WCAG 2.1 Contrast

0B1D12
1A4519
5C6324
FE7236
F70F10
—
1.6
Fail
2.7
Fail
6.4
AA
4.2
AA Large
1.6
Fail
—
1.7
Fail
4.0
AA Large
2.6
Fail
2.7
Fail
1.7
Fail
—
2.4
Fail
1.5
Fail
6.4
AA
4.0
AA Large
2.4
Fail
—
1.5
Fail
4.2
AA Large
2.6
Fail
1.5
Fail
1.5
Fail
—
White BG
17.5AAA
11.0AAA
6.4AA
2.7Fail
4.2AA Large
Black BG
1.2Fail
1.9Fail
3.3AA Large
7.7AAA
5.0AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

131315
2D2D24
5F5F33
C1C045
939010

Deuteranopia

121015
2A2726
5F5E37
CAD448
A0B110

Tritanopia

0C1717
1C2C2E
5C3F42
F75053
EB1010

Achromatopsia

161616
333333
5A5A5A
959595
545454

Shades & Tints Shades & Tints

#0B1D12

Dark
Light

#1A4519

Dark
Light

#5C6324

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #0b1d12;
  --color-2: #1a4519;
  --color-3: #5c6324;
  --color-4: #fe7236;
  --color-5: #f70f10;
}

SCSS

$color-1: #0b1d12;
$color-2: #1a4519;
$color-3: #5c6324;
$color-4: #fe7236;
$color-5: #f70f10;

TAILWIND

colors: {
  'brand-1': '#0b1d12',
  'brand-2': '#1a4519',
  'brand-3': '#5c6324',
  'brand-4': '#fe7236',
  'brand-5': '#f70f10',
}

RGB Array

[11, 29, 18], [26, 69, 25], [92, 99, 36], [254, 114, 54], [247, 15, 16]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #0B1D12, #1A4519, #5C6324, #FE7236, #F70F10 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: #0b1d12; --color-2: #1a4519; --color-3: #5c6324; --color-4: #fe7236; --color-5: #f70f10. 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