← Back to Editor

#52331F · #B09582 · #0C0B09 · #252525 · #180D0B

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

#52331F

Tangerine · DarkOliveGreen · Cinnamon

HEX
#52331F
RGB
rgb(82, 51, 31)
HSL
hsl(24, 45%, 22%)
HSB
hsb(24, 62%, 32%)
CMYK
cmyk(0%, 38%, 62%, 68%)
Oklch
oklch(35.4% 0.055 52.9)

Traditional「Tangerine」· Paint「Cinnamon」· Creative Blush Sunrise

#B09582

Tangerine · DarkGray · Warm Sun

HEX
#B09582
RGB
rgb(176, 149, 130)
HSL
hsl(25, 23%, 60%)
HSB
hsb(25, 26%, 69%)
CMYK
cmyk(0%, 15%, 26%, 31%)
Oklch
oklch(68.9% 0.042 57.1)

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

#0C0B09

Ochre · Black · Amber Gold

HEX
#0C0B09
RGB
rgb(12, 11, 9)
HSL
hsl(40, 14%, 4%)
HSB
hsb(40, 25%, 5%)
CMYK
cmyk(0%, 8%, 25%, 95%)
Oklch
oklch(15.0% 0.005 84.9)

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

#252525

Ink Black · DarkSlateGray · Dark Stone

HEX
#252525
RGB
rgb(37, 37, 37)
HSL
hsl(0, 0%, 15%)
HSB
hsb(0, 0%, 15%)
CMYK
cmyk(0%, 0%, 0%, 85%)
Oklch
oklch(26.4% 0.000 89.9)

Traditional「Ink Black」· Paint「Dark Stone」· Creative Midnight Shadow

#180D0B

Crimson · Black · Deep Berry

HEX
#180D0B
RGB
rgb(24, 13, 11)
HSL
hsl(9, 37%, 7%)
HSB
hsb(9, 54%, 9%)
CMYK
cmyk(0%, 46%, 54%, 91%)
Oklch
oklch(17.4% 0.020 30.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

52331F
1F3D51

Analogous

511F24
52331F
514C1F

Triadic

52331F
1F5133
331F51

Split-Comp.

52331F
1F514C
1F2451

Tetradic

52331F
24511F
1F3D51
4C1F51

Contrast Matrix WCAG 2.1 Contrast

52331F
B09582
0C0B09
252525
180D0B
—
4.0
AA Large
1.7
Fail
1.4
Fail
1.7
Fail
4.0
AA Large
—
7.0
AA
5.5
AA
6.8
AA
1.7
Fail
7.0
AA
—
1.3
Fail
1.0
Fail
1.4
Fail
5.5
AA
1.3
Fail
—
1.2
Fail
1.7
Fail
6.8
AA
1.0
Fail
1.2
Fail
—
White BG
11.3AAA
2.8Fail
19.7AAA
15.3AAA
19.1AAA
Black BG
1.9Fail
7.5AAA
1.1Fail
1.4Fail
1.1Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

454424
A4A487
0C0C09
252525
13130B

Deuteranopia

464925
A6A888
0C0C0A
252525
14150C

Tritanopia

502829
AF8A8B
0C0A0A
252525
170C0C

Achromatopsia

3A3A3A
9B9B9B
0B0B0B
252525
101010

Shades & Tints Shades & Tints

#52331F

Dark
Light

#B09582

Dark
Light

#0C0B09

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #52331f;
  --color-2: #b09582;
  --color-3: #0c0b09;
  --color-4: #252525;
  --color-5: #180d0b;
}

SCSS

$color-1: #52331f;
$color-2: #b09582;
$color-3: #0c0b09;
$color-4: #252525;
$color-5: #180d0b;

TAILWIND

colors: {
  'brand-1': '#52331f',
  'brand-2': '#b09582',
  'brand-3': '#0c0b09',
  'brand-4': '#252525',
  'brand-5': '#180d0b',
}

RGB Array

[82, 51, 31], [176, 149, 130], [12, 11, 9], [37, 37, 37], [24, 13, 11]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #52331F, #B09582, #0C0B09, #252525, #180D0B 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: #52331f; --color-2: #b09582; --color-3: #0c0b09; --color-4: #252525; --color-5: #180d0b. 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