← Back to Editor

#2E291A · #ADAE90 · #BB9C10 · #AC5517

dark

A 4-color dark palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#2E291A

Ochre · DarkSlateGray · Amber Gold

HEX
#2E291A
RGB
rgb(46, 41, 26)
HSL
hsl(45, 28%, 14%)
HSB
hsb(45, 43%, 18%)
CMYK
cmyk(0%, 11%, 43%, 82%)
Oklch
oklch(28.2% 0.027 91.8)

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

#ADAE90

Fresh Green · DarkGray · Sunflower

HEX
#ADAE90
RGB
rgb(173, 174, 144)
HSL
hsl(62, 16%, 62%)
HSB
hsb(62, 17%, 68%)
CMYK
cmyk(1%, 0%, 17%, 32%)
Oklch
oklch(74.2% 0.042 108.9)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

#BB9C10

Ochre · DarkGoldenRod · Honey Gold

HEX
#BB9C10
RGB
rgb(187, 156, 16)
HSL
hsl(49, 84%, 40%)
HSB
hsb(49, 91%, 73%)
CMYK
cmyk(0%, 17%, 91%, 27%)
Oklch
oklch(70.0% 0.141 94.3)

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

#AC5517

Tangerine · Sienna · Amber Brown

HEX
#AC5517
RGB
rgb(172, 85, 23)
HSL
hsl(25, 76%, 38%)
HSB
hsb(25, 87%, 67%)
CMYK
cmyk(0%, 51%, 87%, 33%)
Oklch
oklch(54.7% 0.133 50.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

2E291A
1A1F2E

Analogous

2E1F1A
2E291A
292E1A

Triadic

2E291A
1A2E29
291A2E

Split-Comp.

2E291A
1A292E
1F1A2E

Tetradic

2E291A
1A2E1F
1A1F2E
2E1A29

Contrast Matrix WCAG 2.1 Contrast

2E291A
ADAE90
BB9C10
AC5517
—
6.4
AA
5.4
AA
2.8
Fail
6.4
AA
—
1.2
Fail
2.3
Fail
5.4
AA
1.2
Fail
—
1.9
Fail
2.8
Fail
2.3
Fail
1.9
Fail
—
White BG
14.5AAA
2.3Fail
2.7Fail
5.2AA
Black BG
1.4Fail
9.2AAA
7.9AAA
4.1AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

2C2C1E
ADAD97
AEAD32
868626

Deuteranopia

2C2C1F
ADAD99
AFB23A
8B922A

Tritanopia

2E2021
AD9D9E
B94D53
A83234

Achromatopsia

292929
AAAAAA
959595
686868

Shades & Tints Shades & Tints

#2E291A

Dark
Light

#ADAE90

Dark
Light

#BB9C10

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #2e291a;
  --color-2: #adae90;
  --color-3: #bb9c10;
  --color-4: #ac5517;
}

SCSS

$color-1: #2e291a;
$color-2: #adae90;
$color-3: #bb9c10;
$color-4: #ac5517;

TAILWIND

colors: {
  'brand-1': '#2e291a',
  'brand-2': '#adae90',
  'brand-3': '#bb9c10',
  'brand-4': '#ac5517',
}

RGB Array

[46, 41, 26], [173, 174, 144], [187, 156, 16], [172, 85, 23]

FAQ FAQ

What scenarios is this 4-color palette suitable for?

This dark-style palette of #2E291A, #ADAE90, #BB9C10, #AC5517 is ideal for: tech websites, dark mode UIs, game UIs, infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. It is a balanced and harmonious choice among 4-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #2e291a; --color-2: #adae90; --color-3: #bb9c10; --color-4: #ac5517. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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 4-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