← Back to Editor

#282725 · #443A38 · #847E64 · #B9AA89 · #D8CDAF

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

#282725

Ink Black · DarkSlateGray · Dark Stone

HEX
#282725
RGB
rgb(40, 39, 37)
HSL
hsl(40, 4%, 15%)
HSB
hsb(40, 7%, 16%)
CMYK
cmyk(0%, 2%, 7%, 84%)
Oklch
oklch(27.3% 0.004 84.6)

Traditional「Ink Black」· Paint「Dark Stone」· Creative Midnight Shadow

#443A38

Crimson · DarkSlateGray · Wine Red

HEX
#443A38
RGB
rgb(68, 58, 56)
HSL
hsl(10, 10%, 24%)
HSB
hsb(10, 18%, 27%)
CMYK
cmyk(0%, 15%, 18%, 73%)
Oklch
oklch(35.8% 0.015 31.2)

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

#847E64

Ochre · Gray · Honey Gold

HEX
#847E64
RGB
rgb(132, 126, 100)
HSL
hsl(49, 14%, 45%)
HSB
hsb(49, 24%, 52%)
CMYK
cmyk(0%, 5%, 24%, 48%)
Oklch
oklch(59.1% 0.038 96.6)

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

#B9AA89

Ginger · Tan · Sunflower

HEX
#B9AA89
RGB
rgb(185, 170, 137)
HSL
hsl(41, 26%, 63%)
HSB
hsb(41, 26%, 73%)
CMYK
cmyk(0%, 8%, 26%, 27%)
Oklch
oklch(74.2% 0.048 86.4)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#D8CDAF

Goose Yellow · Silver · Lemon Cream

HEX
#D8CDAF
RGB
rgb(216, 205, 175)
HSL
hsl(44, 34%, 77%)
HSB
hsb(44, 19%, 85%)
CMYK
cmyk(0%, 5%, 19%, 15%)
Oklch
oklch(84.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

282725
252628

Analogous

282525
282725
272825

Triadic

282725
252827
272528

Split-Comp.

282725
252728
252528

Tetradic

282725
252825
252628
282527

Contrast Matrix WCAG 2.1 Contrast

282725
443A38
847E64
B9AA89
D8CDAF
—
1.4
Fail
3.7
AA Large
6.5
AA
9.4
AAA
1.4
Fail
—
2.7
Fail
4.8
AA
7.0
AA
3.7
AA Large
2.7
Fail
—
1.8
Fail
2.6
Fail
6.5
AA
4.8
AA
1.8
Fail
—
1.4
Fail
9.4
AAA
7.0
AA
2.6
Fail
1.4
Fail
—
White BG
14.9AAA
11.0AAA
4.1AA Large
2.3Fail
1.6Fail
Black BG
1.4Fail
1.9Fail
5.1AA
9.2AAA
13.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

282825
404038
81816A
B3B291
D3D3B6

Deuteranopia

282826
404139
82826C
B3B593
D4D5B8

Tritanopia

282626
443939
846F70
B89799
D7BCBD

Achromatopsia

272727
3D3D3D
7D7D7D
ABABAB
CDCDCD

Shades & Tints Shades & Tints

#282725

Dark
Light

#443A38

Dark
Light

#847E64

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #282725;
  --color-2: #443a38;
  --color-3: #847e64;
  --color-4: #b9aa89;
  --color-5: #d8cdaf;
}

SCSS

$color-1: #282725;
$color-2: #443a38;
$color-3: #847e64;
$color-4: #b9aa89;
$color-5: #d8cdaf;

TAILWIND

colors: {
  'brand-1': '#282725',
  'brand-2': '#443a38',
  'brand-3': '#847e64',
  'brand-4': '#b9aa89',
  'brand-5': '#d8cdaf',
}

RGB Array

[40, 39, 37], [68, 58, 56], [132, 126, 100], [185, 170, 137], [216, 205, 175]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #282725, #443A38, #847E64, #B9AA89, #D8CDAF 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: #282725; --color-2: #443a38; --color-3: #847e64; --color-4: #b9aa89; --color-5: #d8cdaf. 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