← Back to Editor

#2E2C2F · #737570 · #D5C9B3 · #564D3E · #310700

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#2E2C2F

Dark Cyan · DarkSlateGray · Dark Stone

HEX
#2E2C2F
RGB
rgb(46, 44, 47)
HSL
hsl(280, 3%, 18%)
HSB
hsb(280, 6%, 18%)
CMYK
cmyk(2%, 6%, 0%, 82%)
Oklch
oklch(29.6% 0.006 314.7)

Traditional「Dark Cyan」· Paint「Dark Stone」· Creative Midnight Shadow

#737570

Ink Gray · DimGray · Warm Gray

HEX
#737570
RGB
rgb(115, 117, 112)
HSL
hsl(84, 2%, 45%)
HSB
hsb(84, 4%, 46%)
CMYK
cmyk(2%, 0%, 4%, 54%)
Oklch
oklch(55.9% 0.008 124.5)

Traditional「Ink Gray」· Paint「Warm Gray」· Creative Urban Concrete

#D5C9B3

Goose Yellow · Silver · Peach Orange

HEX
#D5C9B3
RGB
rgb(213, 201, 179)
HSL
hsl(39, 29%, 77%)
HSB
hsb(39, 16%, 84%)
CMYK
cmyk(0%, 6%, 16%, 16%)
Oklch
oklch(84.0% 0.033 82.8)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

#564D3E

Ochre · DarkOliveGreen · Amber Brown

HEX
#564D3E
RGB
rgb(86, 77, 62)
HSL
hsl(37, 16%, 29%)
HSB
hsb(37, 28%, 34%)
CMYK
cmyk(0%, 10%, 28%, 66%)
Oklch
oklch(42.5% 0.027 80.5)

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

#310700

Vermilion · Black · Deep Berry

HEX
#310700
RGB
rgb(49, 7, 0)
HSL
hsl(9, 100%, 10%)
HSB
hsb(9, 100%, 19%)
CMYK
cmyk(0%, 86%, 100%, 81%)
Oklch
oklch(20.8% 0.071 36.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

2E2C2F
2D2F2D

Analogous

2D2D2F
2E2C2F
2F2D2F

Triadic

2E2C2F
2F2E2D
2D2F2E

Split-Comp.

2E2C2F
2F2F2D
2D2F2D

Tetradic

2E2C2F
2F2D2D
2D2F2D
2D2F2F

Contrast Matrix WCAG 2.1 Contrast

2E2C2F
737570
D5C9B3
564D3E
310700
—
3.0
Fail
8.5
AAA
1.7
Fail
1.3
Fail
3.0
Fail
—
2.8
Fail
1.8
Fail
3.9
AA Large
8.5
AAA
2.8
Fail
—
5.1
AA
11.1
AAA
1.7
Fail
1.8
Fail
5.1
AA
—
2.2
Fail
1.3
Fail
3.9
AA Large
11.1
AAA
2.2
Fail
—
White BG
13.8AAA
4.7AA
1.6Fail
8.3AAA
18.1AAA
Black BG
1.5Fail
4.5AA
12.8AAA
2.5Fail
1.2Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

2D2D2E
747471
D0D0B8
525242
1F1E02

Deuteranopia

2D2D2E
747472
D1D1BA
535343
212402

Tritanopia

2E2E2E
737272
D4BDBD
564445
2F0303

Achromatopsia

2D2D2D
747474
CACACA
4E4E4E
131313

Shades & Tints Shades & Tints

#2E2C2F

Dark
Light

#737570

Dark
Light

#D5C9B3

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #2e2c2f;
  --color-2: #737570;
  --color-3: #d5c9b3;
  --color-4: #564d3e;
  --color-5: #310700;
}

SCSS

$color-1: #2e2c2f;
$color-2: #737570;
$color-3: #d5c9b3;
$color-4: #564d3e;
$color-5: #310700;

TAILWIND

colors: {
  'brand-1': '#2e2c2f',
  'brand-2': '#737570',
  'brand-3': '#d5c9b3',
  'brand-4': '#564d3e',
  'brand-5': '#310700',
}

RGB Array

[46, 44, 47], [115, 117, 112], [213, 201, 179], [86, 77, 62], [49, 7, 0]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #2E2C2F, #737570, #D5C9B3, #564D3E, #310700 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: #2e2c2f; --color-2: #737570; --color-3: #d5c9b3; --color-4: #564d3e; --color-5: #310700. 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