#ADA554 + #BF9E3F + #AD7B0A + #23232F + #423143 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#ADA554

Autumn Sage · GoldenRod · Honey Gold

HEX

#ADA554

RGB

rgb(173, 165, 84)

HSL

hsl(55, 35%, 50%)

HSB

hsb(55, 51%, 68%)

CMYK

cmyk(0%, 5%, 51%, 32%)

Oklch

oklch(71.1% 0.104 103.6)

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

#BF9E3F

Ochre · GoldenRod · Honey Gold

HEX

#BF9E3F

RGB

rgb(191, 158, 63)

HSL

hsl(45, 50%, 50%)

HSB

hsb(45, 67%, 75%)

CMYK

cmyk(0%, 17%, 67%, 25%)

Oklch

oklch(71.1% 0.119 89.7)

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

#AD7B0A

Ochre · DarkGoldenRod · Honey Gold

HEX

#AD7B0A

RGB

rgb(173, 123, 10)

HSL

hsl(42, 89%, 36%)

HSB

hsb(42, 94%, 68%)

CMYK

cmyk(0%, 29%, 94%, 32%)

Oklch

oklch(61.7% 0.126 79.5)

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

#23232F

Deep Indigo · DarkSlateGray · Deep Sea Blue

HEX

#23232F

RGB

rgb(35, 35, 47)

HSL

hsl(240, 15%, 16%)

HSB

hsb(240, 26%, 18%)

CMYK

cmyk(26%, 26%, 0%, 82%)

Oklch

oklch(26.2% 0.022 284.8)

Traditional「Deep Indigo」· Paint「Deep Sea Blue」· Creative Blush Sunrise

#423143

Dark Plum · DarkSlateGray · Eggplant

HEX

#423143

RGB

rgb(66, 49, 67)

HSL

hsl(297, 16%, 23%)

HSB

hsb(297, 27%, 26%)

CMYK

cmyk(1%, 27%, 0%, 74%)

Oklch

oklch(33.9% 0.038 324.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

ADA554

535AAC

Analogous

AC7853

ADA554

87AC53

Triadic

ADA554

53ACA5

A553AC

Split-Comp.

ADA554

5387AC

7853AC

Tetradic

ADA554

53AC78

535AAC

AC5387

Contrast Matrix WCAG 2.1 Contrast

ADA554	BF9E3F	AD7B0A	23232F	423143
—	1.0 Fail	1.5 Fail	6.1 AA	4.7 AA
1.0 Fail	—	1.5 Fail	6.0 AA	4.7 AA
1.5 Fail	1.5 Fail	—	4.1 AA Large	3.2 AA Large
6.1 AA	6.0 AA	4.1 AA Large	—	1.3 Fail
4.7 AA	4.7 AA	3.2 AA Large	1.3 Fail	—

White BG

2.5Fail

2.6Fail

3.7AA Large

15.5AAA

12.0AAA

Black BG

8.3AAA

8.2AAA

5.6AA

1.4Fail

1.8Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

AAA968

B1B056

979725

23232C

3B3A3F

Deuteranopia

AAAB6C

B3B55C

9A9E2C

23232B

3C3D3E

Tritanopia

AD777A

BD686C

AB3B40

232A29

413B3A

Achromatopsia

9E9E9E

9D9D9D

7D7D7D

242424

383838

Shades & Tints Shades & Tints

#ADA554

Dark

Light

#BF9E3F

Dark

Light

#AD7B0A

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ada554;
  --color-2: #bf9e3f;
  --color-3: #ad7b0a;
  --color-4: #23232f;
  --color-5: #423143;
}

SCSS

$color-1: #ada554;
$color-2: #bf9e3f;
$color-3: #ad7b0a;
$color-4: #23232f;
$color-5: #423143;

TAILWIND

colors: {
  'brand-1': '#ada554',
  'brand-2': '#bf9e3f',
  'brand-3': '#ad7b0a',
  'brand-4': '#23232f',
  'brand-5': '#423143',
}

RGB Array

[173, 165, 84], [191, 158, 63], [173, 123, 10], [35, 35, 47], [66, 49, 67]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #ADA554, #BF9E3F, #AD7B0A, #23232F, #423143 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: #ada554; --color-2: #bf9e3f; --color-3: #ad7b0a; --color-4: #23232f; --color-5: #423143. 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