#393635 + #614D3B + #9C5F2C + #9C4D32 + #962D33 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#393635

Dark Cyan · DarkSlateGray · Dark Stone

HEX

#393635

RGB

rgb(57, 54, 53)

HSL

hsl(15, 4%, 22%)

HSB

hsb(15, 7%, 22%)

CMYK

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

Oklch

oklch(33.6% 0.005 39.4)

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

#614D3B

Tangerine · DarkOliveGreen · Amber Brown

HEX

#614D3B

RGB

rgb(97, 77, 59)

HSL

hsl(28, 24%, 31%)

HSB

hsb(28, 39%, 38%)

CMYK

cmyk(0%, 21%, 39%, 62%)

Oklch

oklch(43.6% 0.039 63.5)

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

#9C5F2C

Tangerine · Sienna · Amber Brown

HEX

#9C5F2C

RGB

rgb(156, 95, 44)

HSL

hsl(27, 56%, 39%)

HSB

hsb(27, 72%, 61%)

CMYK

cmyk(0%, 39%, 72%, 39%)

Oklch

oklch(54.4% 0.103 57.8)

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

#9C4D32

Tangerine · Sienna · Amber Brown

HEX

#9C4D32

RGB

rgb(156, 77, 50)

HSL

hsl(15, 51%, 40%)

HSB

hsb(15, 68%, 61%)

CMYK

cmyk(0%, 51%, 68%, 39%)

Oklch

oklch(51.3% 0.113 39.3)

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

#962D33

Crimson · Brown · Wine Red

HEX

#962D33

RGB

rgb(150, 45, 51)

HSL

hsl(357, 54%, 38%)

HSB

hsb(357, 70%, 59%)

CMYK

cmyk(0%, 70%, 66%, 41%)

Oklch

oklch(45.8% 0.140 21.5)

Traditional「Crimson」· Paint「Wine Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

393635

36393A

Analogous

3A3637

393635

3A3936

Triadic

393635

363A37

37363A

Split-Comp.

393635

363A39

36373A

Tetradic

393635

373A36

36393A

39363A

Contrast Matrix WCAG 2.1 Contrast

393635	614D3B	9C5F2C	9C4D32	962D33
—	1.5 Fail	2.3 Fail	2.0 Fail	1.6 Fail
1.5 Fail	—	1.6 Fail	1.3 Fail	1.0 Fail
2.3 Fail	1.6 Fail	—	1.2 Fail	1.5 Fail
2.0 Fail	1.3 Fail	1.2 Fail	—	1.3 Fail
1.6 Fail	1.0 Fail	1.5 Fail	1.3 Fail	—

White BG

12.0AAA

8.0AAA

5.1AA

6.0AA

7.7AAA

Black BG

1.8Fail

2.6Fail

4.1AA Large

3.5AA Large

2.7Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

383835

58583F

828138

7A7939

696832

Deuteranopia

383835

5A5B40

858A3B

7E843A

6F7731

Tritanopia

393535

604344

994244

983E3F

913030

Achromatopsia

373737

515151

6B6B6B

626262

4D4D4D

Shades & Tints Shades & Tints

#393635

Dark

Light

#614D3B

Dark

Light

#9C5F2C

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #393635;
  --color-2: #614d3b;
  --color-3: #9c5f2c;
  --color-4: #9c4d32;
  --color-5: #962d33;
}

SCSS

$color-1: #393635;
$color-2: #614d3b;
$color-3: #9c5f2c;
$color-4: #9c4d32;
$color-5: #962d33;

TAILWIND

colors: {
  'brand-1': '#393635',
  'brand-2': '#614d3b',
  'brand-3': '#9c5f2c',
  'brand-4': '#9c4d32',
  'brand-5': '#962d33',
}

RGB Array

[57, 54, 53], [97, 77, 59], [156, 95, 44], [156, 77, 50], [150, 45, 51]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #393635, #614D3B, #9C5F2C, #9C4D32, #962D33 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: #393635; --color-2: #614d3b; --color-3: #9c5f2c; --color-4: #9c4d32; --color-5: #962d33. 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