← Back to Editor

#D0AE40 · #AFAC99 · #62737A · #2E2C20 · #111610

dark

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

ProfoundPremiumWarmCool

Industry INDUSTRY

FinanceLuxury

UI Context UI CONTEXT

Dark ThemeCorporateData Visualization

Color Details Color Details

#D0AE40

Ginger · GoldenRod · Sunflower

HEX
#D0AE40
RGB
rgb(208, 174, 64)
HSL
hsl(46, 61%, 53%)
HSB
hsb(46, 69%, 82%)
CMYK
cmyk(0%, 16%, 69%, 18%)
Oklch
oklch(76.1% 0.131 91.5)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

#AFAC99

Fresh Green · DarkGray · Sunflower

HEX
#AFAC99
RGB
rgb(175, 172, 153)
HSL
hsl(52, 12%, 64%)
HSB
hsb(52, 13%, 69%)
CMYK
cmyk(0%, 2%, 13%, 31%)
Oklch
oklch(74.2% 0.027 99.7)

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

#62737A

Slate Blue · DimGray · Mint Ice

HEX
#62737A
RGB
rgb(98, 115, 122)
HSL
hsl(198, 11%, 43%)
HSB
hsb(198, 20%, 48%)
CMYK
cmyk(20%, 6%, 0%, 52%)
Oklch
oklch(54.4% 0.023 224.6)

Traditional「Slate Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#2E2C20

Autumn Sage · DarkSlateGray · Amber Gold

HEX
#2E2C20
RGB
rgb(46, 44, 32)
HSL
hsl(51, 18%, 15%)
HSB
hsb(51, 30%, 18%)
CMYK
cmyk(0%, 4%, 30%, 82%)
Oklch
oklch(29.1% 0.021 99.6)

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

#111610

Celadon · Black · Dark Green

HEX
#111610
RGB
rgb(17, 22, 16)
HSL
hsl(110, 16%, 7%)
HSB
hsb(110, 27%, 9%)
CMYK
cmyk(23%, 0%, 27%, 91%)
Oklch
oklch(19.3% 0.014 140.4)

Traditional「Celadon」· Paint「Dark Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D0AE40
3E60D0

Analogous

D0653E
D0AE40
A9D03E

Triadic

D0AE40
3ED0AE
AE3ED0

Split-Comp.

D0AE40
3EA9D0
653ED0

Tetradic

D0AE40
3ED065
3E60D0
D03EA9

Contrast Matrix WCAG 2.1 Contrast

D0AE40
AFAC99
62737A
2E2C20
111610
—
1.1
Fail
2.3
Fail
6.6
AA
8.6
AAA
1.1
Fail
—
2.2
Fail
6.1
AA
8.0
AAA
2.3
Fail
2.2
Fail
—
2.8
Fail
3.7
AA Large
6.6
AA
6.1
AA
2.8
Fail
—
1.3
Fail
8.6
AAA
8.0
AAA
3.7
AA Large
1.3
Fail
—
White BG
2.1Fail
2.3Fail
4.9AA
14.0AAA
18.3AAA
Black BG
9.8AAA
9.2AAA
4.3AA Large
1.5Fail
1.1Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

C1C15B
AEAE9E
696A78
2D2D23
131311

Deuteranopia

C3C661
AEAE9F
686778
2D2D24
131312

Tritanopia

CE7074
AFA1A2
637777
2E2526
111313

Achromatopsia

ACACAC
ABABAB
6F6F6F
2B2B2B
141414

Shades & Tints Shades & Tints

#D0AE40

Dark
Light

#AFAC99

Dark
Light

#62737A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d0ae40;
  --color-2: #afac99;
  --color-3: #62737a;
  --color-4: #2e2c20;
  --color-5: #111610;
}

SCSS

$color-1: #d0ae40;
$color-2: #afac99;
$color-3: #62737a;
$color-4: #2e2c20;
$color-5: #111610;

TAILWIND

colors: {
  'brand-1': '#d0ae40',
  'brand-2': '#afac99',
  'brand-3': '#62737a',
  'brand-4': '#2e2c20',
  'brand-5': '#111610',
}

RGB Array

[208, 174, 64], [175, 172, 153], [98, 115, 122], [46, 44, 32], [17, 22, 16]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This dark-style palette of #D0AE40, #AFAC99, #62737A, #2E2C20, #111610 is ideal for: brand design, premium product pages, magazine layouts, tech websites, dark mode UIs, game UIs, infographics, data visualization, accessible design. Low-saturation colors convey a sophisticated, premium feel. High contrast ensures clear visual hierarchy and readability. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #d0ae40; --color-2: #afac99; --color-3: #62737a; --color-4: #2e2c20; --color-5: #111610. 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 5-color scheme is especially suited for finance, legal, luxury industries. Restrained colors convey professionalism and trust. 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