← Back to Editor

#0C0D08 · #0B1F24 · #FF7300 · #B3B579 · #B1F0CD

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#0C0D08

Grass Green · Black · Dark Green

HEX
#0C0D08
RGB
rgb(12, 13, 8)
HSL
hsl(72, 24%, 4%)
HSB
hsb(72, 38%, 5%)
CMYK
cmyk(8%, 0%, 38%, 95%)
Oklch
oklch(15.6% 0.011 116.6)

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

#0B1F24

Lake Blue · Black · Peacock Green

HEX
#0B1F24
RGB
rgb(11, 31, 36)
HSL
hsl(192, 53%, 9%)
HSB
hsb(192, 69%, 14%)
CMYK
cmyk(69%, 14%, 0%, 86%)
Oklch
oklch(22.5% 0.028 216.2)

Traditional「Lake Blue」· Paint「Peacock Green」· Creative Blush Sunrise

#FF7300

Tangerine · OrangeRed · Amber Brown

HEX
#FF7300
RGB
rgb(255, 115, 0)
HSL
hsl(27, 100%, 50%)
HSB
hsb(27, 100%, 100%)
CMYK
cmyk(0%, 55%, 100%, 0%)
Oklch
oklch(71.3% 0.195 47.9)

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

#B3B579

Autumn Sage · Tan · Sunflower

HEX
#B3B579
RGB
rgb(179, 181, 121)
HSL
hsl(62, 29%, 59%)
HSB
hsb(62, 33%, 71%)
CMYK
cmyk(1%, 0%, 33%, 29%)
Oklch
oklch(75.7% 0.080 109.8)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

#B1F0CD

Emerald · LightBlue · Mint Green

HEX
#B1F0CD
RGB
rgb(177, 240, 205)
HSL
hsl(147, 68%, 82%)
HSB
hsb(147, 26%, 94%)
CMYK
cmyk(26%, 0%, 15%, 6%)
Oklch
oklch(90.3% 0.080 160.0)

Traditional「Emerald」· Paint「Mint Green」· Creative Mint Breeze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

0C0D08
09080D

Analogous

0D0B08
0C0D08
090D08

Triadic

0C0D08
080C0D
0D080C

Split-Comp.

0C0D08
08090D
0B080D

Tetradic

0C0D08
080D0B
09080D
0D0809

Contrast Matrix WCAG 2.1 Contrast

0C0D08
0B1F24
FF7300
B3B579
B1F0CD
—
1.1
Fail
7.2
AAA
9.1
AAA
15.1
AAA
1.1
Fail
—
6.2
AA
7.9
AAA
13.1
AAA
7.2
AAA
6.2
AA
—
1.3
Fail
2.1
Fail
9.1
AAA
7.9
AAA
1.3
Fail
—
1.7
Fail
15.1
AAA
13.1
AAA
2.1
Fail
1.7
Fail
—
White BG
19.5AAA
17.0AAA
2.7Fail
2.1Fail
1.3Fail
Black BG
1.1Fail
1.2Fail
7.7AAA
9.8AAA
16.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

0C0C09
141423
C2C11C
B4B488
CCCDD5

Deuteranopia

0C0C0A
131123
CBD523
B4B48B
C9C4D8

Tritanopia

0C0A0A
0C2222
F83237
B39396
B4DCDE

Achromatopsia

0C0C0C
1A1A1A
909090
AEAEAE
D9D9D9

Shades & Tints Shades & Tints

#0C0D08

Dark
Light

#0B1F24

Dark
Light

#FF7300

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #0c0d08;
  --color-2: #0b1f24;
  --color-3: #ff7300;
  --color-4: #b3b579;
  --color-5: #b1f0cd;
}

SCSS

$color-1: #0c0d08;
$color-2: #0b1f24;
$color-3: #ff7300;
$color-4: #b3b579;
$color-5: #b1f0cd;

TAILWIND

colors: {
  'brand-1': '#0c0d08',
  'brand-2': '#0b1f24',
  'brand-3': '#ff7300',
  'brand-4': '#b3b579',
  'brand-5': '#b1f0cd',
}

RGB Array

[12, 13, 8], [11, 31, 36], [255, 115, 0], [179, 181, 121], [177, 240, 205]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #0C0D08, #0B1F24, #FF7300, #B3B579, #B1F0CD is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #0c0d08; --color-2: #0b1f24; --color-3: #ff7300; --color-4: #b3b579; --color-5: #b1f0cd. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. 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 tech, SaaS, healthcare, eco industries. 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