← Back to Editor

#8F9181 · #DBCDAB · #91746A · #5E5158 · #3E3C4D

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

#8F9181

Ash · Gray · Warm Gray

HEX
#8F9181
RGB
rgb(143, 145, 129)
HSL
hsl(67, 7%, 54%)
HSB
hsb(67, 11%, 57%)
CMYK
cmyk(1%, 0%, 11%, 43%)
Oklch
oklch(65.0% 0.023 112.8)

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

#DBCDAB

Goose Yellow · Wheat · Lemon Cream

HEX
#DBCDAB
RGB
rgb(219, 205, 171)
HSL
hsl(43, 40%, 76%)
HSB
hsb(43, 22%, 86%)
CMYK
cmyk(0%, 6%, 22%, 14%)
Oklch
oklch(85.1% 0.048 88.3)

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

#91746A

Tangerine · Gray · Amber Brown

HEX
#91746A
RGB
rgb(145, 116, 106)
HSL
hsl(15, 16%, 49%)
HSB
hsb(15, 27%, 57%)
CMYK
cmyk(0%, 20%, 27%, 43%)
Oklch
oklch(58.4% 0.040 39.9)

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

#5E5158

Ink Gray · DimGray · Charcoal

HEX
#5E5158
RGB
rgb(94, 81, 88)
HSL
hsl(328, 7%, 34%)
HSB
hsb(328, 14%, 37%)
CMYK
cmyk(0%, 14%, 6%, 63%)
Oklch
oklch(45.0% 0.020 344.3)

Traditional「Ink Gray」· Paint「Charcoal」· Creative Midnight Shadow

#3E3C4D

Deep Indigo · DarkSlateGray · Prussian Blue

HEX
#3E3C4D
RGB
rgb(62, 60, 77)
HSL
hsl(247, 12%, 27%)
HSB
hsb(247, 22%, 30%)
CMYK
cmyk(19%, 22%, 0%, 70%)
Oklch
oklch(36.5% 0.029 290.3)

Traditional「Deep Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

8F9181
838192

Analogous

928C81
8F9181
889281

Triadic

8F9181
819092
928190

Split-Comp.

8F9181
818892
8C8192

Tetradic

8F9181
81928C
838192
928188

Contrast Matrix WCAG 2.1 Contrast

8F9181
DBCDAB
91746A
5E5158
3E3C4D
—
2.0
Fail
1.3
Fail
2.3
Fail
3.3
AA Large
2.0
Fail
—
2.7
Fail
4.8
AA
6.8
AA
1.3
Fail
2.7
Fail
—
1.8
Fail
2.5
Fail
2.3
Fail
4.8
AA
1.8
Fail
—
1.4
Fail
3.3
AA Large
6.8
AA
2.5
Fail
1.4
Fail
—
White BG
3.2AA Large
1.6Fail
4.3AA Large
7.5AAA
10.7AAA
Black BG
6.5AA
13.3AAA
4.9AA
2.8Fail
2.0Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

909085
D5D5B3
84846C
585856
3D3D49

Deuteranopia

909086
D6D7B5
86886D
595A56
3D3D48

Tritanopia

8F8889
DABABB
906E6F
5D5555
3E4645

Achromatopsia

8F8F8F
CDCDCD
7C7C7C
565656
3F3F3F

Shades & Tints Shades & Tints

#8F9181

Dark
Light

#DBCDAB

Dark
Light

#91746A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #8f9181;
  --color-2: #dbcdab;
  --color-3: #91746a;
  --color-4: #5e5158;
  --color-5: #3e3c4d;
}

SCSS

$color-1: #8f9181;
$color-2: #dbcdab;
$color-3: #91746a;
$color-4: #5e5158;
$color-5: #3e3c4d;

TAILWIND

colors: {
  'brand-1': '#8f9181',
  'brand-2': '#dbcdab',
  'brand-3': '#91746a',
  'brand-4': '#5e5158',
  'brand-5': '#3e3c4d',
}

RGB Array

[143, 145, 129], [219, 205, 171], [145, 116, 106], [94, 81, 88], [62, 60, 77]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #8F9181, #DBCDAB, #91746A, #5E5158, #3E3C4D 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: #8f9181; --color-2: #dbcdab; --color-3: #91746a; --color-4: #5e5158; --color-5: #3e3c4d. 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