← Back to Editor

#847163 · #676C65 · #4B484F · #332C34 · #3B0C2C

A 5-color palette 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

#847163

Tangerine · DimGray · Amber Brown

HEX
#847163
RGB
rgb(132, 113, 99)
HSL
hsl(25, 14%, 45%)
HSB
hsb(25, 25%, 52%)
CMYK
cmyk(0%, 14%, 25%, 48%)
Oklch
oklch(56.3% 0.032 58.4)

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

#676C65

Ink Gray · DimGray · Warm Gray

HEX
#676C65
RGB
rgb(103, 108, 101)
HSL
hsl(103, 3%, 41%)
HSB
hsb(103, 6%, 42%)
CMYK
cmyk(5%, 0%, 6%, 58%)
Oklch
oklch(52.5% 0.012 136.6)

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

#4B484F

Dark Cyan · DarkSlateGray · Charcoal

HEX
#4B484F
RGB
rgb(75, 72, 79)
HSL
hsl(266, 5%, 30%)
HSB
hsb(266, 9%, 31%)
CMYK
cmyk(5%, 9%, 0%, 69%)
Oklch
oklch(40.7% 0.012 305.1)

Traditional「Dark Cyan」· Paint「Charcoal」· Creative Midnight Shadow

#332C34

Dark Plum · DarkSlateGray · Dark Stone

HEX
#332C34
RGB
rgb(51, 44, 52)
HSL
hsl(293, 8%, 19%)
HSB
hsb(293, 15%, 20%)
CMYK
cmyk(2%, 15%, 0%, 80%)
Oklch
oklch(30.4% 0.017 322.0)

Traditional「Dark Plum」· Paint「Dark Stone」· Creative Midnight Shadow

#3B0C2C

Rose Purple · Black · Dark Purple

HEX
#3B0C2C
RGB
rgb(59, 12, 44)
HSL
hsl(319, 66%, 14%)
HSB
hsb(319, 80%, 23%)
CMYK
cmyk(0%, 80%, 25%, 77%)
Oklch
oklch(25.1% 0.084 343.1)

Traditional「Rose Purple」· Paint「Dark Purple」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

847163
637583

Analogous

836365
847163
838063

Triadic

847163
638370
706383

Split-Comp.

847163
638380
636583

Tetradic

847163
658363
637583
806383

Contrast Matrix WCAG 2.1 Contrast

847163
676C65
4B484F
332C34
3B0C2C
—
1.2
Fail
1.9
Fail
2.9
Fail
3.5
AA Large
1.2
Fail
—
1.7
Fail
2.5
Fail
3.1
AA Large
1.9
Fail
1.7
Fail
—
1.5
Fail
1.8
Fail
2.9
Fail
2.5
Fail
1.5
Fail
—
1.2
Fail
3.5
AA Large
3.1
AA Large
1.8
Fail
1.2
Fail
—
White BG
4.6AA
5.4AA
9.0AAA
13.5AAA
16.5AAA
Black BG
4.5AA
3.9AA Large
2.3Fail
1.6Fail
1.3Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

7C7C66
696967
4A4A4D
303032
272624

Deuteranopia

7D7E67
696967
4A4A4D
303132
292D22

Tritanopia

83696A
676868
4B4C4C
333130
391E1D

Achromatopsia

757575
6A6A6A
4A4A4A
2F2F2F
1E1E1E

Shades & Tints Shades & Tints

#847163

Dark
Light

#676C65

Dark
Light

#4B484F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #847163;
  --color-2: #676c65;
  --color-3: #4b484f;
  --color-4: #332c34;
  --color-5: #3b0c2c;
}

SCSS

$color-1: #847163;
$color-2: #676c65;
$color-3: #4b484f;
$color-4: #332c34;
$color-5: #3b0c2c;

TAILWIND

colors: {
  'brand-1': '#847163',
  'brand-2': '#676c65',
  'brand-3': '#4b484f',
  'brand-4': '#332c34',
  'brand-5': '#3b0c2c',
}

RGB Array

[132, 113, 99], [103, 108, 101], [75, 72, 79], [51, 44, 52], [59, 12, 44]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #847163, #676C65, #4B484F, #332C34, #3B0C2C 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: #847163; --color-2: #676c65; --color-3: #4b484f; --color-4: #332c34; --color-5: #3b0c2c. 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 general-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