#BDAF32 + #88803F + #6B5434 + #483531 + #18151C - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#BDAF32

Autumn Sage · GoldenRod · Honey Gold

HEX

#BDAF32

RGB

rgb(189, 175, 50)

HSL

hsl(54, 58%, 47%)

HSB

hsb(54, 74%, 74%)

CMYK

cmyk(0%, 7%, 74%, 26%)

Oklch

oklch(74.4% 0.140 102.7)

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

#88803F

Autumn Sage · Sienna · Honey Gold

HEX

#88803F

RGB

rgb(136, 128, 63)

HSL

hsl(53, 37%, 39%)

HSB

hsb(53, 54%, 53%)

CMYK

cmyk(0%, 6%, 54%, 47%)

Oklch

oklch(59.3% 0.087 102.3)

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

#6B5434

Ochre · DarkOliveGreen · Amber Brown

HEX

#6B5434

RGB

rgb(107, 84, 52)

HSL

hsl(35, 35%, 31%)

HSB

hsb(35, 51%, 42%)

CMYK

cmyk(0%, 21%, 51%, 58%)

Oklch

oklch(46.2% 0.056 74.8)

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

#483531

Crimson · DarkSlateGray · Wine Red

HEX

#483531

RGB

rgb(72, 53, 49)

HSL

hsl(10, 19%, 24%)

HSB

hsb(10, 32%, 28%)

CMYK

cmyk(0%, 26%, 32%, 72%)

Oklch

oklch(34.9% 0.028 32.1)

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

#18151C

Deep Indigo · Black · Dark Purple

HEX

#18151C

RGB

rgb(24, 21, 28)

HSL

hsl(266, 14%, 10%)

HSB

hsb(266, 25%, 11%)

CMYK

cmyk(14%, 25%, 0%, 89%)

Oklch

oklch(20.2% 0.014 304.6)

Traditional「Deep Indigo」· Paint「Dark Purple」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

BDAF32

3240BD

Analogous

BD6A32

BDAF32

86BD32

Triadic

BDAF32

32BDAF

AF32BD

Split-Comp.

BDAF32

3286BD

6A32BD

Tetradic

BDAF32

32BD6A

3240BD

BD3286

Contrast Matrix WCAG 2.1 Contrast

BDAF32	88803F	6B5434	483531	18151C
—	1.8 Fail	3.2 AA Large	5.1 AA	8.0 AAA
1.8 Fail	—	1.8 Fail	2.8 Fail	4.5 AA Large
3.2 AA Large	1.8 Fail	—	1.6 Fail	2.5 Fail
5.1 AA	2.8 Fail	1.6 Fail	—	1.6 Fail
8.0 AAA	4.5 AA Large	2.5 Fail	1.6 Fail	—

White BG

2.2Fail

4.0AA Large

7.1AAA

11.5AAA

18.1AAA

Black BG

9.3AAA

5.2AA

2.9Fail

1.8Fail

1.2Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

B7B750

85844F

61613C

404032

17171A

Deuteranopia

B8B958

858653

62643E

414232

17171A

Tritanopia

BC686D

885B5E

6A4243

473333

181919

Achromatopsia

A5A5A5

7B7B7B

575757

3A3A3A

171717

Shades & Tints Shades & Tints

#BDAF32

Dark

Light

#88803F

Dark

Light

#6B5434

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #bdaf32;
  --color-2: #88803f;
  --color-3: #6b5434;
  --color-4: #483531;
  --color-5: #18151c;
}

SCSS

$color-1: #bdaf32;
$color-2: #88803f;
$color-3: #6b5434;
$color-4: #483531;
$color-5: #18151c;

TAILWIND

colors: {
  'brand-1': '#bdaf32',
  'brand-2': '#88803f',
  'brand-3': '#6b5434',
  'brand-4': '#483531',
  'brand-5': '#18151c',
}

RGB Array

[189, 175, 50], [136, 128, 63], [107, 84, 52], [72, 53, 49], [24, 21, 28]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #BDAF32, #88803F, #6B5434, #483531, #18151C 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: #bdaf32; --color-2: #88803f; --color-3: #6b5434; --color-4: #483531; --color-5: #18151c. 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