#B9851F + #9B8458 + #7F7059 + #2D3645 + #350920 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#B9851F

Ochre · DarkGoldenRod · Honey Gold

HEX

#B9851F

RGB

rgb(185, 133, 31)

HSL

hsl(40, 71%, 42%)

HSB

hsb(40, 83%, 73%)

CMYK

cmyk(0%, 28%, 83%, 27%)

Oklch

oklch(65.2% 0.126 78.6)

Traditional「Ochre」· Paint「Honey Gold」· Creative Blush Sunrise

#9B8458

Ochre · Gray · Amber Brown

HEX

#9B8458

RGB

rgb(155, 132, 88)

HSL

hsl(39, 28%, 48%)

HSB

hsb(39, 43%, 61%)

CMYK

cmyk(0%, 15%, 43%, 39%)

Oklch

oklch(62.4% 0.067 83.1)

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

#7F7059

Ochre · DimGray · Amber Brown

HEX

#7F7059

RGB

rgb(127, 112, 89)

HSL

hsl(36, 18%, 42%)

HSB

hsb(36, 30%, 50%)

CMYK

cmyk(0%, 12%, 30%, 50%)

Oklch

oklch(55.3% 0.039 78.4)

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

#2D3645

Indigo · DarkSlateGray · Prussian Blue

HEX

#2D3645

RGB

rgb(45, 54, 69)

HSL

hsl(218, 21%, 22%)

HSB

hsb(218, 35%, 27%)

CMYK

cmyk(35%, 22%, 0%, 73%)

Oklch

oklch(33.1% 0.029 260.6)

Traditional「Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

#350920

Rose Purple · Black · Raspberry

HEX

#350920

RGB

rgb(53, 9, 32)

HSL

hsl(329, 71%, 12%)

HSB

hsb(329, 83%, 21%)

CMYK

cmyk(0%, 83%, 40%, 79%)

Oklch

oklch(22.9% 0.075 352.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B9851F

1F52B7

Analogous

B7381F

B9851F

9EB71F

Triadic

B9851F

1FB784

841FB7

Split-Comp.

B9851F

1F9EB7

381FB7

Tetradic

B9851F

1FB738

1F52B7

B71F9E

Contrast Matrix WCAG 2.1 Contrast

B9851F	9B8458	7F7059	2D3645	350920
—	1.1 Fail	1.5 Fail	3.7 AA Large	5.3 AA
1.1 Fail	—	1.3 Fail	3.4 AA Large	4.8 AA
1.5 Fail	1.3 Fail	—	2.5 Fail	3.6 AA Large
3.7 AA Large	3.4 AA Large	2.5 Fail	—	1.4 Fail
5.3 AA	4.8 AA	3.6 AA Large	1.4 Fail	—

White BG

3.3AA Large

3.6AA Large

4.8AA

12.2AAA

17.3AAA

Black BG

6.4AA

5.8AA

4.4AA Large

1.7Fail

1.2Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

A2A238

919163

79785F

313141

22221A

Deuteranopia

A6A93E

929465

797B60

303041

252819

Tritanopia

B64B4F

9A6B6D

7E6364

2D3F3E

331615

Achromatopsia

898989

868686

727272

353535

191919

Shades & Tints Shades & Tints

#B9851F

Dark

Light

#9B8458

Dark

Light

#7F7059

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b9851f;
  --color-2: #9b8458;
  --color-3: #7f7059;
  --color-4: #2d3645;
  --color-5: #350920;
}

SCSS

$color-1: #b9851f;
$color-2: #9b8458;
$color-3: #7f7059;
$color-4: #2d3645;
$color-5: #350920;

TAILWIND

colors: {
  'brand-1': '#b9851f',
  'brand-2': '#9b8458',
  'brand-3': '#7f7059',
  'brand-4': '#2d3645',
  'brand-5': '#350920',
}

RGB Array

[185, 133, 31], [155, 132, 88], [127, 112, 89], [45, 54, 69], [53, 9, 32]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #B9851F, #9B8458, #7F7059, #2D3645, #350920 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: #b9851f; --color-2: #9b8458; --color-3: #7f7059; --color-4: #2d3645; --color-5: #350920. 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