← Back to Editor

#2E2327 · #38182D · #8B436B · #8C997D · #E5DABC

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

#2E2327

Dark Violet · DarkSlateGray · Raspberry

HEX
#2E2327
RGB
rgb(46, 35, 39)
HSL
hsl(338, 14%, 16%)
HSB
hsb(338, 24%, 18%)
CMYK
cmyk(0%, 24%, 15%, 82%)
Oklch
oklch(27.1% 0.018 354.6)

Traditional「Dark Violet」· Paint「Raspberry」· Creative Blush Sunrise

#38182D

Rose Purple · DarkSlateGray · Raspberry

HEX
#38182D
RGB
rgb(56, 24, 45)
HSL
hsl(321, 40%, 16%)
HSB
hsb(321, 57%, 22%)
CMYK
cmyk(0%, 57%, 20%, 78%)
Oklch
oklch(26.4% 0.060 342.0)

Traditional「Rose Purple」· Paint「Raspberry」· Creative Blush Sunrise

#8B436B

Rose Purple · DimGray · Camellia

HEX
#8B436B
RGB
rgb(139, 67, 107)
HSL
hsl(327, 35%, 40%)
HSB
hsb(327, 52%, 55%)
CMYK
cmyk(0%, 52%, 23%, 45%)
Oklch
oklch(48.7% 0.110 347.5)

Traditional「Rose Purple」· Paint「Camellia」· Creative Blush Sunrise

#8C997D

Grass Green · Gray · Olive Green

HEX
#8C997D
RGB
rgb(140, 153, 125)
HSL
hsl(88, 12%, 55%)
HSB
hsb(88, 18%, 60%)
CMYK
cmyk(8%, 0%, 18%, 40%)
Oklch
oklch(66.5% 0.043 127.8)

Traditional「Grass Green」· Paint「Olive Green」· Creative Blush Sunrise

#E5DABC

Goose Yellow · Wheat · Lemon Cream

HEX
#E5DABC
RGB
rgb(229, 218, 188)
HSL
hsl(44, 44%, 82%)
HSB
hsb(44, 18%, 90%)
CMYK
cmyk(0%, 5%, 18%, 10%)
Oklch
oklch(88.9% 0.042 90.3)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

2E2327
232F2A

Analogous

2F232D
2E2327
2F2523

Triadic

2E2327
272F23
23272F

Split-Comp.

2E2327
232F25
232D2F

Tetradic

2E2327
2D2F23
232F2A
25232F

Contrast Matrix WCAG 2.1 Contrast

2E2327
38182D
8B436B
8C997D
E5DABC
—
1.0
Fail
2.2
Fail
5.0
AA
10.9
AAA
1.0
Fail
—
2.3
Fail
5.2
AA
11.3
AAA
2.2
Fail
2.3
Fail
—
2.2
Fail
4.8
AA
5.0
AA
5.2
AA
2.2
Fail
—
2.2
Fail
10.9
AAA
11.3
AAA
4.8
AA
2.2
Fail
—
White BG
15.2AAA
15.7AAA
6.7AA
3.0AA Large
1.4Fail
Black BG
1.4Fail
1.3Fail
3.1AA Large
7.0AA
15.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

292926
2A2A28
6C6B61
929284
E0E0C3

Deuteranopia

2A2B26
2C2E27
70755F
919085
E1E2C5

Tritanopia

2D2525
362423
875A58
8D898A
E4C9CA

Achromatopsia

272727
242424
5D5D5D
929292
DADADA

Shades & Tints Shades & Tints

#2E2327

Dark
Light

#38182D

Dark
Light

#8B436B

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #2e2327;
  --color-2: #38182d;
  --color-3: #8b436b;
  --color-4: #8c997d;
  --color-5: #e5dabc;
}

SCSS

$color-1: #2e2327;
$color-2: #38182d;
$color-3: #8b436b;
$color-4: #8c997d;
$color-5: #e5dabc;

TAILWIND

colors: {
  'brand-1': '#2e2327',
  'brand-2': '#38182d',
  'brand-3': '#8b436b',
  'brand-4': '#8c997d',
  'brand-5': '#e5dabc',
}

RGB Array

[46, 35, 39], [56, 24, 45], [139, 67, 107], [140, 153, 125], [229, 218, 188]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #2E2327, #38182D, #8B436B, #8C997D, #E5DABC is ideal for: brand design, premium product pages, magazine layouts, 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: #2e2327; --color-2: #38182d; --color-3: #8b436b; --color-4: #8c997d; --color-5: #e5dabc. 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. 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