← Back to Editor

#347373 · #7F996B · #99823D · #8C463F · #332E39

dark

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

ProfoundPremiumWarmCool

Industry INDUSTRY

FinanceLuxury

UI Context UI CONTEXT

Dark ThemeCorporate

Color Details Color Details

#347373

Slate Blue · SeaGreen · Mint Ice

HEX
#347373
RGB
rgb(52, 115, 115)
HSL
hsl(180, 38%, 33%)
HSB
hsb(180, 55%, 45%)
CMYK
cmyk(55%, 0%, 0%, 55%)
Oklch
oklch(51.5% 0.065 195.3)

TraditionalSlate Blue」· PaintMint Ice」· Creative Blush Sunrise

#7F996B

Celadon · Gray · Olive Green

HEX
#7F996B
RGB
rgb(127, 153, 107)
HSL
hsl(94, 18%, 51%)
HSB
hsb(94, 30%, 60%)
CMYK
cmyk(17%, 0%, 30%, 40%)
Oklch
oklch(65.1% 0.072 132.1)

TraditionalCeladon」· PaintOlive Green」· Creative Blush Sunrise

#99823D

Ochre · Sienna · Honey Gold

HEX
#99823D
RGB
rgb(153, 130, 61)
HSL
hsl(45, 43%, 42%)
HSB
hsb(45, 60%, 60%)
CMYK
cmyk(0%, 15%, 60%, 40%)
Oklch
oklch(61.3% 0.093 91.0)

TraditionalOchre」· PaintHoney Gold」· Creative Blush Sunrise

#8C463F

Crimson · Sienna · Wine Red

HEX
#8C463F
RGB
rgb(140, 70, 63)
HSL
hsl(5, 38%, 40%)
HSB
hsb(5, 55%, 55%)
CMYK
cmyk(0%, 50%, 55%, 45%)
Oklch
oklch(48.0% 0.096 27.1)

TraditionalCrimson」· PaintWine Red」· Creative Blush Sunrise

#332E39

Deep Indigo · DarkSlateGray · Dark Purple

HEX
#332E39
RGB
rgb(51, 46, 57)
HSL
hsl(267, 11%, 20%)
HSB
hsb(267, 19%, 22%)
CMYK
cmyk(11%, 19%, 0%, 78%)
Oklch
oklch(31.1% 0.021 305.8)

TraditionalDeep Indigo」· PaintDark Purple」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

347373
743434

Analogous

347454
347373
345474

Triadic

347373
743474
747434

Split-Comp.

347373
743454
745434

Tetradic

347373
543474
743434
547434

Contrast Matrix WCAG 2.1 Contrast

347373
7F996B
99823D
8C463F
332E39
1.7
Fail
1.5
Fail
1.3
Fail
2.4
Fail
1.7
Fail
1.2
Fail
2.2
Fail
4.2
AA Large
1.5
Fail
1.2
Fail
1.8
Fail
3.5
AA Large
1.3
Fail
2.2
Fail
1.8
Fail
1.9
Fail
2.4
Fail
4.2
AA Large
3.5
AA Large
1.9
Fail
White BG
5.5AA
3.1AA Large
3.7AA Large
6.9AA
13.2AAA
Black BG
3.8AA Large
6.7AA
5.6AA
3.1AA Large
1.6Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

4F5073
8A8A76
8F8F4E
6E6D41
313136

Deuteranopia

4C4773
898779
909252
727741
313136

Tritanopia

377373
807F81
985B5E
894242
333434

Achromatopsia

606060
8C8C8C
818181
5A5A5A
313131

Shades & Tints Shades & Tints

#347373

Dark
Light

#7F996B

Dark
Light

#99823D

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #347373;
  --color-2: #7f996b;
  --color-3: #99823d;
  --color-4: #8c463f;
  --color-5: #332e39;
}

SCSS

$color-1: #347373;
$color-2: #7f996b;
$color-3: #99823d;
$color-4: #8c463f;
$color-5: #332e39;

TAILWIND

colors: {
  'brand-1': '#347373',
  'brand-2': '#7f996b',
  'brand-3': '#99823d',
  'brand-4': '#8c463f',
  'brand-5': '#332e39',
}

RGB Array

[52, 115, 115], [127, 153, 107], [153, 130, 61], [140, 70, 63], [51, 46, 57]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This dark-style palette of #347373, #7F996B, #99823D, #8C463F, #332E39 is ideal for: brand design, premium product pages, magazine layouts, tech websites, dark mode UIs, game UIs. 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: #347373; --color-2: #7f996b; --color-3: #99823d; --color-4: #8c463f; --color-5: #332e39. 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. 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 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