← Back to Editor

#E2D4B2 · #834854 · #542831 · #76824E · #22231E

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

#E2D4B2

Goose Yellow · Wheat · Lemon Cream

HEX
#E2D4B2
RGB
rgb(226, 212, 178)
HSL
hsl(43, 45%, 79%)
HSB
hsb(43, 21%, 89%)
CMYK
cmyk(0%, 6%, 21%, 11%)
Oklch
oklch(87.3% 0.048 88.3)

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

#834854

Crimson · DimGray · Wine Red

HEX
#834854
RGB
rgb(131, 72, 84)
HSL
hsl(348, 29%, 40%)
HSB
hsb(348, 45%, 51%)
CMYK
cmyk(0%, 45%, 36%, 49%)
Oklch
oklch(47.6% 0.081 7.6)

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

#542831

Crimson · DarkSlateGray · Wine Red

HEX
#542831
RGB
rgb(84, 40, 49)
HSL
hsl(348, 35%, 24%)
HSB
hsb(348, 52%, 33%)
CMYK
cmyk(0%, 52%, 42%, 67%)
Oklch
oklch(33.9% 0.066 8.2)

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

#76824E

Grass Green · DimGray · Olive Green

HEX
#76824E
RGB
rgb(118, 130, 78)
HSL
hsl(74, 25%, 41%)
HSB
hsb(74, 40%, 51%)
CMYK
cmyk(9%, 0%, 40%, 49%)
Oklch
oklch(58.4% 0.075 119.4)

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

#22231E

Grass Green · Black · Dark Stone

HEX
#22231E
RGB
rgb(34, 35, 30)
HSL
hsl(72, 8%, 13%)
HSB
hsb(72, 14%, 14%)
CMYK
cmyk(3%, 0%, 14%, 86%)
Oklch
oklch(25.3% 0.009 116.3)

Traditional「Grass Green」· Paint「Dark Stone」· Creative Midnight Shadow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E2D4B2
B1BFE2

Analogous

E2BCB1
E2D4B2
D7E2B1

Triadic

E2D4B2
B1E2D4
D4B1E2

Split-Comp.

E2D4B2
B1D7E2
BCB1E2

Tetradic

E2D4B2
B1E2BC
B1BFE2
E2B1D7

Contrast Matrix WCAG 2.1 Contrast

E2D4B2
834854
542831
76824E
22231E
—
4.7
AA
8.3
AAA
2.8
Fail
10.8
AAA
4.7
AA
—
1.8
Fail
1.7
Fail
2.3
Fail
8.3
AAA
1.8
Fail
—
2.9
Fail
1.3
Fail
2.8
Fail
1.7
Fail
2.9
Fail
—
3.8
AA Large
10.8
AAA
2.3
Fail
1.3
Fail
3.8
AA Large
—
White BG
1.5Fail
7.0AA
12.2AAA
4.1AA Large
15.8AAA
Black BG
14.3AAA
3.0AA Large
1.7Fail
5.1AA
1.3Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

DCDCBA
696951
41412F
7B7B5B
22221F

Deuteranopia

DDDEBC
6D7150
44472E
7B7A5E
222220

Tritanopia

E1C1C2
804F4E
522D2D
776567
222020

Achromatopsia

D4D4D4
5B5B5B
363636
787878
222222

Shades & Tints Shades & Tints

#E2D4B2

Dark
Light

#834854

Dark
Light

#542831

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e2d4b2;
  --color-2: #834854;
  --color-3: #542831;
  --color-4: #76824e;
  --color-5: #22231e;
}

SCSS

$color-1: #e2d4b2;
$color-2: #834854;
$color-3: #542831;
$color-4: #76824e;
$color-5: #22231e;

TAILWIND

colors: {
  'brand-1': '#e2d4b2',
  'brand-2': '#834854',
  'brand-3': '#542831',
  'brand-4': '#76824e',
  'brand-5': '#22231e',
}

RGB Array

[226, 212, 178], [131, 72, 84], [84, 40, 49], [118, 130, 78], [34, 35, 30]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E2D4B2, #834854, #542831, #76824E, #22231E 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: #e2d4b2; --color-2: #834854; --color-3: #542831; --color-4: #76824e; --color-5: #22231e. 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