← Back to Editor

#2A1B18 · #5F2533 · #B18A25 · #D1B699 · #1D2B2B

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

#2A1B18

Crimson · Black · Deep Berry

HEX
#2A1B18
RGB
rgb(42, 27, 24)
HSL
hsl(10, 27%, 13%)
HSB
hsb(10, 43%, 16%)
CMYK
cmyk(0%, 36%, 43%, 84%)
Oklch
oklch(24.0% 0.025 31.6)

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

#5F2533

Crimson · DarkSlateGray · Wine Red

HEX
#5F2533
RGB
rgb(95, 37, 51)
HSL
hsl(346, 44%, 26%)
HSB
hsb(346, 61%, 37%)
CMYK
cmyk(0%, 61%, 46%, 63%)
Oklch
oklch(35.3% 0.086 7.5)

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

#B18A25

Ochre · DarkGoldenRod · Honey Gold

HEX
#B18A25
RGB
rgb(177, 138, 37)
HSL
hsl(43, 65%, 42%)
HSB
hsb(43, 79%, 69%)
CMYK
cmyk(0%, 22%, 79%, 31%)
Oklch
oklch(65.3% 0.122 86.1)

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

#D1B699

Goose Yellow · Tan · Warm Sun

HEX
#D1B699
RGB
rgb(209, 182, 153)
HSL
hsl(31, 38%, 71%)
HSB
hsb(31, 27%, 82%)
CMYK
cmyk(0%, 13%, 27%, 18%)
Oklch
oklch(79.2% 0.050 69.0)

Traditional「Goose Yellow」· Paint「Warm Sun」· Creative Honey Glow

#1D2B2B

Slate Blue · DarkSlateGray · Peacock Green

HEX
#1D2B2B
RGB
rgb(29, 43, 43)
HSL
hsl(180, 19%, 14%)
HSB
hsb(180, 33%, 17%)
CMYK
cmyk(33%, 0%, 0%, 83%)
Oklch
oklch(27.6% 0.019 196.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

2A1B18
18272A

Analogous

2A181E
2A1B18
2A2418

Triadic

2A1B18
182A1B
1B182A

Split-Comp.

2A1B18
182A24
181E2A

Tetradic

2A1B18
1E2A18
18272A
24182A

Contrast Matrix WCAG 2.1 Contrast

2A1B18
5F2533
B18A25
D1B699
1D2B2B
—
1.4
Fail
5.1
AA
8.6
AAA
1.1
Fail
1.4
Fail
—
3.6
AA Large
6.0
AA
1.3
Fail
5.1
AA
3.6
AA Large
—
1.7
Fail
4.6
AA
8.6
AAA
6.0
AA
1.7
Fail
—
7.6
AAA
1.1
Fail
1.3
Fail
4.6
AA
7.6
AAA
—
White BG
16.6AAA
11.7AAA
3.2AA Large
1.9Fail
14.7AAA
Black BG
1.3Fail
1.8Fail
6.5AA
10.9AAA
1.4Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

242319
464530
A0A03D
C5C5A0
23232B

Deuteranopia

242619
494E2F
A2A543
C7C9A2
22212B

Tritanopia

291919
5C2D2C
AF5155
D0A6A7
1E2B2B

Achromatopsia

1F1F1F
383838
8A8A8A
BBBBBB
272727

Shades & Tints Shades & Tints

#2A1B18

Dark
Light

#5F2533

Dark
Light

#B18A25

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #2a1b18;
  --color-2: #5f2533;
  --color-3: #b18a25;
  --color-4: #d1b699;
  --color-5: #1d2b2b;
}

SCSS

$color-1: #2a1b18;
$color-2: #5f2533;
$color-3: #b18a25;
$color-4: #d1b699;
$color-5: #1d2b2b;

TAILWIND

colors: {
  'brand-1': '#2a1b18',
  'brand-2': '#5f2533',
  'brand-3': '#b18a25',
  'brand-4': '#d1b699',
  'brand-5': '#1d2b2b',
}

RGB Array

[42, 27, 24], [95, 37, 51], [177, 138, 37], [209, 182, 153], [29, 43, 43]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #2A1B18, #5F2533, #B18A25, #D1B699, #1D2B2B is ideal for: tech websites, dark mode UIs, game UIs, 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: #2a1b18; --color-2: #5f2533; --color-3: #b18a25; --color-4: #d1b699; --color-5: #1d2b2b. 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 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