← Back to Editor

#6D817D · #787D71 · #847763 · #8F7256 · #996C48

dark

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#6D817D

Mineral Blue · Gray · Warm Gray

HEX
#6D817D
RGB
rgb(109, 129, 125)
HSL
hsl(168, 8%, 47%)
HSB
hsb(168, 16%, 51%)
CMYK
cmyk(16%, 0%, 3%, 49%)
Oklch
oklch(58.6% 0.024 182.0)

Traditional「Mineral Blue」· Paint「Warm Gray」· Creative Urban Concrete

#787D71

Ink Gray · Gray · Warm Gray

HEX
#787D71
RGB
rgb(120, 125, 113)
HSL
hsl(85, 5%, 47%)
HSB
hsb(85, 10%, 49%)
CMYK
cmyk(4%, 0%, 10%, 51%)
Oklch
oklch(58.2% 0.019 125.5)

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

#847763

Ochre · Gray · Amber Brown

HEX
#847763
RGB
rgb(132, 119, 99)
HSL
hsl(36, 14%, 45%)
HSB
hsb(36, 25%, 52%)
CMYK
cmyk(0%, 10%, 25%, 48%)
Oklch
oklch(57.6% 0.034 78.6)

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

#8F7256

Tangerine · DimGray · Amber Brown

HEX
#8F7256
RGB
rgb(143, 114, 86)
HSL
hsl(29, 25%, 45%)
HSB
hsb(29, 40%, 56%)
CMYK
cmyk(0%, 20%, 40%, 44%)
Oklch
oklch(57.3% 0.055 65.4)

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

#996C48

Tangerine · Sienna · Amber Brown

HEX
#996C48
RGB
rgb(153, 108, 72)
HSL
hsl(27, 36%, 44%)
HSB
hsb(27, 53%, 60%)
CMYK
cmyk(0%, 29%, 53%, 40%)
Oklch
oklch(56.9% 0.077 59.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

6D817D
816E72

Analogous

6E8174
6D817D
6E7C81

Triadic

6D817D
7E6E81
817E6E

Split-Comp.

6D817D
816E7C
81746E

Tetradic

6D817D
746E81
816E72
7C816E

Contrast Matrix WCAG 2.1 Contrast

6D817D
787D71
847763
8F7256
996C48
—
1.0
Fail
1.1
Fail
1.1
Fail
1.1
Fail
1.0
Fail
—
1.0
Fail
1.1
Fail
1.1
Fail
1.1
Fail
1.0
Fail
—
1.0
Fail
1.0
Fail
1.1
Fail
1.1
Fail
1.0
Fail
—
1.0
Fail
1.1
Fail
1.1
Fail
1.0
Fail
1.0
Fail
—
White BG
4.1AA Large
4.2AA Large
4.4AA Large
4.5AA Large
4.6AA
Black BG
5.1AA
5.0AA
4.8AA
4.7AA
4.6AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

76767E
7A7A74
7E7E68
82825D
868551

Deuteranopia

75737E
7A7A75
7F8069
84865E
888C53

Tritanopia

6E7F7F
787677
836C6D
8E6263
975859

Achromatopsia

7B7B7B
7A7A7A
797979
777777
757575

Shades & Tints Shades & Tints

#6D817D

Dark
Light

#787D71

Dark
Light

#847763

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #6d817d;
  --color-2: #787d71;
  --color-3: #847763;
  --color-4: #8f7256;
  --color-5: #996c48;
}

SCSS

$color-1: #6d817d;
$color-2: #787d71;
$color-3: #847763;
$color-4: #8f7256;
$color-5: #996c48;

TAILWIND

colors: {
  'brand-1': '#6d817d',
  'brand-2': '#787d71',
  'brand-3': '#847763',
  'brand-4': '#8f7256',
  'brand-5': '#996c48',
}

RGB Array

[109, 129, 125], [120, 125, 113], [132, 119, 99], [143, 114, 86], [153, 108, 72]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This dark-style palette of #6D817D, #787D71, #847763, #8F7256, #996C48 is ideal for: brand design, premium product pages, magazine layouts. Low-saturation colors convey a sophisticated, premium feel. 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: #6d817d; --color-2: #787d71; --color-3: #847763; --color-4: #8f7256; --color-5: #996c48. 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. 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 dark-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