← Back to Editor

#998670 · #787066 · #61544D · #5D4E44 · #826363

dark

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#998670

Ginger · Gray · Warm Sun

HEX
#998670
RGB
rgb(153, 134, 112)
HSL
hsl(32, 17%, 52%)
HSB
hsb(32, 27%, 60%)
CMYK
cmyk(0%, 12%, 27%, 40%)
Oklch
oklch(63.1% 0.039 71.1)

TraditionalGinger」· PaintWarm Sun」· Creative Blush Sunrise

#787066

Ochre · DimGray · Warm Gray

HEX
#787066
RGB
rgb(120, 112, 102)
HSL
hsl(33, 8%, 44%)
HSB
hsb(33, 15%, 47%)
CMYK
cmyk(0%, 7%, 15%, 53%)
Oklch
oklch(54.9% 0.018 73.5)

TraditionalOchre」· PaintWarm Gray」· Creative Urban Concrete

#61544D

Tangerine · DimGray · Amber Brown

HEX
#61544D
RGB
rgb(97, 84, 77)
HSL
hsl(21, 11%, 34%)
HSB
hsb(21, 21%, 38%)
CMYK
cmyk(0%, 13%, 21%, 62%)
Oklch
oklch(45.7% 0.021 50.1)

TraditionalTangerine」· PaintAmber Brown」· Creative Blush Sunrise

#5D4E44

Tangerine · DarkOliveGreen · Amber Brown

HEX
#5D4E44
RGB
rgb(93, 78, 68)
HSL
hsl(24, 16%, 32%)
HSB
hsb(24, 27%, 36%)
CMYK
cmyk(0%, 16%, 27%, 64%)
Oklch
oklch(43.6% 0.026 55.6)

TraditionalTangerine」· PaintAmber Brown」· Creative Blush Sunrise

#826363

Crimson · DimGray · Passion Red

HEX
#826363
RGB
rgb(130, 99, 99)
HSL
hsl(0, 14%, 45%)
HSB
hsb(0, 24%, 51%)
CMYK
cmyk(0%, 24%, 24%, 49%)
Oklch
oklch(53.1% 0.040 18.5)

TraditionalCrimson」· PaintPassion Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

998670
708399

Analogous

997170
998670
989970

Triadic

998670
709986
867099

Split-Comp.

998670
709899
717099

Tetradic

998670
709971
708399
997098

Contrast Matrix WCAG 2.1 Contrast

998670
787066
61544D
5D4E44
826363
1.4
Fail
2.1
Fail
2.3
Fail
1.5
Fail
1.4
Fail
1.5
Fail
1.6
Fail
1.1
Fail
2.1
Fail
1.5
Fail
1.1
Fail
1.4
Fail
2.3
Fail
1.6
Fail
1.1
Fail
1.5
Fail
1.5
Fail
1.1
Fail
1.4
Fail
1.5
Fail
White BG
3.5AA Large
4.9AA
7.3AAA
8.0AAA
5.4AA
Black BG
6.0AA
4.3AA Large
2.9Fail
2.6Fail
3.9AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

919175
757468
5B5B4F
575646
757463

Deuteranopia

929377
757669
5C5D4F
575947
767963

Tritanopia

987A7A
786A6B
605050
5C4849
806363

Achromatopsia

898989
717171
575757
515151
6C6C6C

Shades & Tints Shades & Tints

#998670

Dark
Light

#787066

Dark
Light

#61544D

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #998670;
  --color-2: #787066;
  --color-3: #61544d;
  --color-4: #5d4e44;
  --color-5: #826363;
}

SCSS

$color-1: #998670;
$color-2: #787066;
$color-3: #61544d;
$color-4: #5d4e44;
$color-5: #826363;

TAILWIND

colors: {
  'brand-1': '#998670',
  'brand-2': '#787066',
  'brand-3': '#61544d',
  'brand-4': '#5d4e44',
  'brand-5': '#826363',
}

RGB Array

[153, 134, 112], [120, 112, 102], [97, 84, 77], [93, 78, 68], [130, 99, 99]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This dark-style palette of #998670, #787066, #61544D, #5D4E44, #826363 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: #998670; --color-2: #787066; --color-3: #61544d; --color-4: #5d4e44; --color-5: #826363. 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