← Back to Editor

#120B0B · #BFD9AD · #D9A34C · #856161 · #574A66

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

#120B0B

Crimson · Black · Deep Berry

HEX
#120B0B
RGB
rgb(18, 11, 11)
HSL
hsl(0, 24%, 6%)
HSB
hsb(0, 39%, 7%)
CMYK
cmyk(0%, 39%, 39%, 93%)
Oklch
oklch(15.9% 0.012 18.5)

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

#BFD9AD

Celadon · Silver · Apple Green

HEX
#BFD9AD
RGB
rgb(191, 217, 173)
HSL
hsl(95, 37%, 76%)
HSB
hsb(95, 20%, 85%)
CMYK
cmyk(12%, 0%, 20%, 15%)
Oklch
oklch(85.5% 0.066 132.6)

Traditional「Celadon」· Paint「Apple Green」· Creative Mint Breeze

#D9A34C

Ginger · SandyBrown · Warm Sun

HEX
#D9A34C
RGB
rgb(217, 163, 76)
HSL
hsl(37, 65%, 57%)
HSB
hsb(37, 65%, 85%)
CMYK
cmyk(0%, 25%, 65%, 15%)
Oklch
oklch(75.0% 0.122 76.9)

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

#856161

Crimson · DimGray · Passion Red

HEX
#856161
RGB
rgb(133, 97, 97)
HSL
hsl(0, 16%, 45%)
HSB
hsb(0, 27%, 52%)
CMYK
cmyk(0%, 27%, 27%, 48%)
Oklch
oklch(53.0% 0.047 18.8)

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

#574A66

Deep Indigo · DimGray · Eggplant

HEX
#574A66
RGB
rgb(87, 74, 102)
HSL
hsl(268, 16%, 35%)
HSB
hsb(268, 27%, 40%)
CMYK
cmyk(15%, 27%, 0%, 60%)
Oklch
oklch(43.3% 0.048 305.6)

Traditional「Deep Indigo」· Paint「Eggplant」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

120B0B
0C1313

Analogous

130C0F
120B0B
130F0C

Triadic

120B0B
0C130C
0C0C13

Split-Comp.

120B0B
0C130F
0C0F13

Tetradic

120B0B
0F130C
0C1313
0F0C13

Contrast Matrix WCAG 2.1 Contrast

120B0B
BFD9AD
D9A34C
856161
574A66
—
12.7
AAA
8.6
AAA
3.6
AA Large
2.4
Fail
12.7
AAA
—
1.5
Fail
3.5
AA Large
5.3
AA
8.6
AAA
1.5
Fail
—
2.4
Fail
3.6
AA Large
3.6
AA Large
3.5
AA Large
2.4
Fail
—
1.5
Fail
2.4
Fail
5.3
AA
3.6
AA Large
1.5
Fail
—
White BG
19.5AAA
1.5Fail
2.3Fail
5.4AA
8.2AAA
Black BG
1.1Fail
13.7AAA
9.3AAA
3.9AA Large
2.6Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

0F0F0B
CACAB8
C2C161
757561
51515F

Deuteranopia

0F100B
C9C7BA
C5C966
787A61
52535E

Tritanopia

120B0B
C0C0C2
D67275
836161
565A59

Achromatopsia

0D0D0D
CCCCCC
A9A9A9
6C6C6C
515151

Shades & Tints Shades & Tints

#120B0B

Dark
Light

#BFD9AD

Dark
Light

#D9A34C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #120b0b;
  --color-2: #bfd9ad;
  --color-3: #d9a34c;
  --color-4: #856161;
  --color-5: #574a66;
}

SCSS

$color-1: #120b0b;
$color-2: #bfd9ad;
$color-3: #d9a34c;
$color-4: #856161;
$color-5: #574a66;

TAILWIND

colors: {
  'brand-1': '#120b0b',
  'brand-2': '#bfd9ad',
  'brand-3': '#d9a34c',
  'brand-4': '#856161',
  'brand-5': '#574a66',
}

RGB Array

[18, 11, 11], [191, 217, 173], [217, 163, 76], [133, 97, 97], [87, 74, 102]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #120B0B, #BFD9AD, #D9A34C, #856161, #574A66 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: #120b0b; --color-2: #bfd9ad; --color-3: #d9a34c; --color-4: #856161; --color-5: #574a66. 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