#362839 + #5F4D7D + #98643D + #9B8C39 + #B7A656 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#362839

Dark Plum · DarkSlateGray · Dark Purple

HEX

#362839

RGB

rgb(54, 40, 57)

HSL

hsl(289, 18%, 19%)

HSB

hsb(289, 30%, 22%)

CMYK

cmyk(5%, 30%, 0%, 78%)

Oklch

oklch(30.0% 0.036 320.3)

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

#5F4D7D

Deep Indigo · DarkSlateBlue · Eggplant

HEX

#5F4D7D

RGB

rgb(95, 77, 125)

HSL

hsl(263, 24%, 40%)

HSB

hsb(263, 38%, 49%)

CMYK

cmyk(24%, 38%, 0%, 51%)

Oklch

oklch(45.9% 0.079 300.6)

Traditional「Deep Indigo」· Paint「Eggplant」· Creative Blush Sunrise

#98643D

Tangerine · Sienna · Amber Brown

HEX

#98643D

RGB

rgb(152, 100, 61)

HSL

hsl(26, 43%, 42%)

HSB

hsb(26, 60%, 60%)

CMYK

cmyk(0%, 34%, 60%, 40%)

Oklch

oklch(55.1% 0.086 56.6)

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

#9B8C39

Autumn Sage · DarkGoldenRod · Honey Gold

HEX

#9B8C39

RGB

rgb(155, 140, 57)

HSL

hsl(51, 46%, 42%)

HSB

hsb(51, 63%, 61%)

CMYK

cmyk(0%, 10%, 63%, 39%)

Oklch

oklch(63.7% 0.105 99.1)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#B7A656

Ginger · SandyBrown · Sunflower

HEX

#B7A656

RGB

rgb(183, 166, 86)

HSL

hsl(49, 40%, 53%)

HSB

hsb(49, 53%, 72%)

CMYK

cmyk(0%, 9%, 53%, 28%)

Oklch

oklch(72.3% 0.103 97.6)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

362839

2B3928

Analogous

2D2839

362839

392834

Triadic

362839

393628

283936

Split-Comp.

362839

343928

28392D

Tetradic

362839

392D28

2B3928

283439

Contrast Matrix WCAG 2.1 Contrast

362839	5F4D7D	98643D	9B8C39	B7A656
—	1.9 Fail	2.8 Fail	4.1 AA Large	5.7 AA
1.9 Fail	—	1.5 Fail	2.2 Fail	3.0 AA Large
2.8 Fail	1.5 Fail	—	1.5 Fail	2.0 Fail
4.1 AA Large	2.2 Fail	1.5 Fail	—	1.4 Fail
5.7 AA	3.0 AA Large	2.0 Fail	1.4 Fail	—

White BG

13.8AAA

7.4AAA

5.0AA

3.4AA Large

2.4Fail

Black BG

1.5Fail

2.8Fail

4.2AA Large

6.2AA

8.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

303035

575771

818146

95944D

B0AF69

Deuteranopia

313234

585A6F

858849

959752

B1B26E

Tritanopia

353231

5E6866

954E50

9A5D60

B6797C

Achromatopsia

2E2E2E

585858

6F6F6F

878787

A2A2A2

Shades & Tints Shades & Tints

#362839

Dark

Light

#5F4D7D

Dark

Light

#98643D

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #362839;
  --color-2: #5f4d7d;
  --color-3: #98643d;
  --color-4: #9b8c39;
  --color-5: #b7a656;
}

SCSS

$color-1: #362839;
$color-2: #5f4d7d;
$color-3: #98643d;
$color-4: #9b8c39;
$color-5: #b7a656;

TAILWIND

colors: {
  'brand-1': '#362839',
  'brand-2': '#5f4d7d',
  'brand-3': '#98643d',
  'brand-4': '#9b8c39',
  'brand-5': '#b7a656',
}

RGB Array

[54, 40, 57], [95, 77, 125], [152, 100, 61], [155, 140, 57], [183, 166, 86]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #362839, #5F4D7D, #98643D, #9B8C39, #B7A656 is ideal for: tech websites, dark mode UIs, game UIs. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #362839; --color-2: #5f4d7d; --color-3: #98643d; --color-4: #9b8c39; --color-5: #b7a656. 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 tech, SaaS, healthcare, eco industries. 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