#BA9E25 + #561B5F + #113251 + #840A4D + #131212 · dark - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#BA9E25

Ochre · GoldenRod · Honey Gold

HEX

#BA9E25

RGB

rgb(186, 158, 37)

HSL

hsl(49, 67%, 44%)

HSB

hsb(49, 80%, 73%)

CMYK

cmyk(0%, 15%, 80%, 27%)

Oklch

oklch(70.4% 0.134 95.0)

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

#561B5F

Royal Purple · DarkSlateBlue · Eggplant

HEX

#561B5F

RGB

rgb(86, 27, 95)

HSL

hsl(292, 56%, 24%)

HSB

hsb(292, 72%, 37%)

CMYK

cmyk(9%, 72%, 0%, 63%)

Oklch

oklch(34.6% 0.126 322.1)

Traditional「Royal Purple」· Paint「Eggplant」· Creative Blush Sunrise

#113251

Lake Blue · MidnightBlue · Deep Sea Blue

HEX

#113251

RGB

rgb(17, 50, 81)

HSL

hsl(209, 65%, 19%)

HSB

hsb(209, 79%, 32%)

CMYK

cmyk(79%, 38%, 0%, 68%)

Oklch

oklch(31.0% 0.068 249.8)

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

#840A4D

Rose Purple · Purple · Camellia

HEX

#840A4D

RGB

rgb(132, 10, 77)

HSL

hsl(327, 86%, 28%)

HSB

hsb(327, 92%, 52%)

CMYK

cmyk(0%, 92%, 42%, 48%)

Oklch

oklch(40.5% 0.159 355.2)

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

#131212

Ink Black · Black · Jet Black

HEX

#131212

RGB

rgb(19, 18, 18)

HSL

hsl(0, 3%, 7%)

HSB

hsb(0, 5%, 7%)

CMYK

cmyk(0%, 5%, 5%, 93%)

Oklch

oklch(18.3% 0.002 17.3)

Traditional「Ink Black」· Paint「Jet Black」· Creative Midnight Shadow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

BA9E25

2541BB

Analogous

BB5525

BA9E25

8CBB25

Triadic

BA9E25

25BBA0

A025BB

Split-Comp.

BA9E25

258CBB

5525BB

Tetradic

BA9E25

25BB55

2541BB

BB258C

Contrast Matrix WCAG 2.1 Contrast

BA9E25	561B5F	113251	840A4D	131212
—	4.7 AA	5.0 AA	3.8 AA Large	7.1 AAA
4.7 AA	—	1.1 Fail	1.2 Fail	1.5 Fail
5.0 AA	1.1 Fail	—	1.3 Fail	1.4 Fail
3.8 AA Large	1.2 Fail	1.3 Fail	—	1.9 Fail
7.1 AAA	1.5 Fail	1.4 Fail	1.9 Fail	—

White BG

2.6Fail

12.2AAA

13.1AAA

9.9AAA

18.7AAA

Black BG

8.0AAA

1.7Fail

1.6Fail

2.1Fail

1.1Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

AEAE42

3C3C4F

1F2049

4F4E3D

131312

Deuteranopia

B0B249

40444B

1D1B48

565F39

131312

Tritanopia

B9595E

53423F

134442

7E302D

131212

Achromatopsia

999999

343434

2C2C2C

363636

121212

Shades & Tints Shades & Tints

#BA9E25

Dark

Light

#561B5F

Dark

Light

#113251

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ba9e25;
  --color-2: #561b5f;
  --color-3: #113251;
  --color-4: #840a4d;
  --color-5: #131212;
}

SCSS

$color-1: #ba9e25;
$color-2: #561b5f;
$color-3: #113251;
$color-4: #840a4d;
$color-5: #131212;

TAILWIND

colors: {
  'brand-1': '#ba9e25',
  'brand-2': '#561b5f',
  'brand-3': '#113251',
  'brand-4': '#840a4d',
  'brand-5': '#131212',
}

RGB Array

[186, 158, 37], [86, 27, 95], [17, 50, 81], [132, 10, 77], [19, 18, 18]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This dark-style palette of #BA9E25, #561B5F, #113251, #840A4D, #131212 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: #ba9e25; --color-2: #561b5f; --color-3: #113251; --color-4: #840a4d; --color-5: #131212. 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 dark-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