← Back to Editor

#0C0B0B · #1C1416 · #302628 · #874453 · #CAAF90

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

ProfoundPremiumWarm

Industry INDUSTRY

FinanceLuxury

UI Context UI CONTEXT

Dark ThemeCorporateData Visualization

Color Details Color Details

#0C0B0B

Ink Black · Black · Jet Black

HEX
#0C0B0B
RGB
rgb(12, 11, 11)
HSL
hsl(0, 4%, 5%)
HSB
hsb(0, 8%, 5%)
CMYK
cmyk(0%, 8%, 8%, 95%)
Oklch
oklch(15.1% 0.002 17.3)

Traditional「Ink Black」· Paint「Jet Black」· Creative Midnight Shadow

#1C1416

Crimson · Black · Deep Berry

HEX
#1C1416
RGB
rgb(28, 20, 22)
HSL
hsl(345, 17%, 9%)
HSB
hsb(345, 29%, 11%)
CMYK
cmyk(0%, 29%, 21%, 89%)
Oklch
oklch(20.2% 0.014 1.7)

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

#302628

Crimson · DarkSlateGray · Deep Berry

HEX
#302628
RGB
rgb(48, 38, 40)
HSL
hsl(348, 12%, 17%)
HSB
hsb(348, 21%, 19%)
CMYK
cmyk(0%, 21%, 17%, 81%)
Oklch
oklch(28.1% 0.015 4.6)

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

#874453

Crimson · Sienna · Wine Red

HEX
#874453
RGB
rgb(135, 68, 83)
HSL
hsl(347, 33%, 40%)
HSB
hsb(347, 50%, 53%)
CMYK
cmyk(0%, 50%, 39%, 47%)
Oklch
oklch(47.5% 0.093 7.0)

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

#CAAF90

Ginger · Tan · Warm Sun

HEX
#CAAF90
RGB
rgb(202, 175, 144)
HSL
hsl(32, 35%, 68%)
HSB
hsb(32, 29%, 79%)
CMYK
cmyk(0%, 13%, 29%, 21%)
Oklch
oklch(77.0% 0.053 70.8)

Traditional「Ginger」· Paint「Warm Sun」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

0C0B0B
0C0D0D

Analogous

0D0C0D
0C0B0B
0D0D0C

Triadic

0C0B0B
0C0D0C
0C0C0D

Split-Comp.

0C0B0B
0C0D0D
0C0D0D

Tetradic

0C0B0B
0D0D0C
0C0D0D
0D0C0D

Contrast Matrix WCAG 2.1 Contrast

0C0B0B
1C1416
302628
874453
CAAF90
—
1.1
Fail
1.3
Fail
2.8
Fail
9.4
AAA
1.1
Fail
—
1.2
Fail
2.6
Fail
8.7
AAA
1.3
Fail
1.2
Fail
—
2.1
Fail
7.0
AAA
2.8
Fail
2.6
Fail
2.1
Fail
—
3.4
AA Large
9.4
AAA
8.7
AAA
7.0
AAA
3.4
AA Large
—
White BG
19.7AAA
18.1AAA
14.6AAA
7.0AAA
2.1Fail
Black BG
1.1Fail
1.2Fail
1.4Fail
3.0Fail
10.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

0C0C0B
191816
2C2C28
6A694F
BEBE98

Deuteranopia

0C0C0B
191A15
2C2D27
6E734F
C0C299

Tritanopia

0C0B0B
1C1515
2F2727
844D4C
C99D9F

Achromatopsia

0B0B0B
171717
292929
5A5A5A
B4B4B4

Shades & Tints Shades & Tints

#0C0B0B

Dark
Light

#1C1416

Dark
Light

#302628

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #0c0b0b;
  --color-2: #1c1416;
  --color-3: #302628;
  --color-4: #874453;
  --color-5: #caaf90;
}

SCSS

$color-1: #0c0b0b;
$color-2: #1c1416;
$color-3: #302628;
$color-4: #874453;
$color-5: #caaf90;

TAILWIND

colors: {
  'brand-1': '#0c0b0b',
  'brand-2': '#1c1416',
  'brand-3': '#302628',
  'brand-4': '#874453',
  'brand-5': '#caaf90',
}

RGB Array

[12, 11, 11], [28, 20, 22], [48, 38, 40], [135, 68, 83], [202, 175, 144]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #0C0B0B, #1C1416, #302628, #874453, #CAAF90 is ideal for: brand design, premium product pages, magazine layouts, tech websites, dark mode UIs, game UIs, infographics, data visualization, accessible design. Low-saturation colors convey a sophisticated, premium feel. High contrast ensures clear visual hierarchy and readability. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #0c0b0b; --color-2: #1c1416; --color-3: #302628; --color-4: #874453; --color-5: #caaf90. 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 finance, legal, luxury industries. Restrained colors convey professionalism and trust. 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