← Back to Editor

#322F29 · #F6D53E · #AEA14C · #0A0A09 · #6D562F

A 5-color palette 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

#322F29

Ochre · DarkSlateGray · Amber Gold

HEX
#322F29
RGB
rgb(50, 47, 41)
HSL
hsl(40, 10%, 18%)
HSB
hsb(40, 18%, 20%)
CMYK
cmyk(0%, 6%, 18%, 80%)
Oklch
oklch(30.6% 0.011 84.6)

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

#F6D53E

Ginger · SandyBrown · Sunflower

HEX
#F6D53E
RGB
rgb(246, 213, 62)
HSL
hsl(49, 91%, 60%)
HSB
hsb(49, 75%, 96%)
CMYK
cmyk(0%, 13%, 75%, 4%)
Oklch
oklch(87.6% 0.163 96.2)

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

#AEA14C

Autumn Sage · GoldenRod · Honey Gold

HEX
#AEA14C
RGB
rgb(174, 161, 76)
HSL
hsl(52, 39%, 49%)
HSB
hsb(52, 56%, 68%)
CMYK
cmyk(0%, 7%, 56%, 32%)
Oklch
oklch(70.3% 0.107 100.7)

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

#0A0A09

Ink Black · Black · Jet Black

HEX
#0A0A09
RGB
rgb(10, 10, 9)
HSL
hsl(60, 5%, 4%)
HSB
hsb(60, 10%, 4%)
CMYK
cmyk(0%, 0%, 10%, 96%)
Oklch
oklch(14.4% 0.002 106.7)

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

#6D562F

Ochre · DarkOliveGreen · Amber Brown

HEX
#6D562F
RGB
rgb(109, 86, 47)
HSL
hsl(38, 40%, 31%)
HSB
hsb(38, 57%, 43%)
CMYK
cmyk(0%, 21%, 57%, 57%)
Oklch
oklch(46.7% 0.063 79.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

322F29
292C32

Analogous

322B29
322F29
313229

Triadic

322F29
29322F
2F2932

Split-Comp.

322F29
293132
2B2932

Tetradic

322F29
29322B
292C32
322931

Contrast Matrix WCAG 2.1 Contrast

322F29
F6D53E
AEA14C
0A0A09
6D562F
—
9.2
AAA
5.1
AA
1.5
Fail
1.9
Fail
9.2
AAA
—
1.8
Fail
13.7
AAA
4.8
AA
5.1
AA
1.8
Fail
—
7.5
AAA
2.6
Fail
1.5
Fail
13.7
AAA
7.5
AAA
—
2.9
Fail
1.9
Fail
4.8
AA
2.6
Fail
2.9
Fail
—
White BG
13.3AAA
1.4Fail
2.6Fail
19.8AAA
6.9AA
Black BG
1.6Fail
14.5AAA
8.0AAA
1.1Fail
3.0AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

31312A
E8E763
A8A861
0A0A09
636338

Deuteranopia

31312B
EAEC6B
A9AA66
0A0A09
64663B

Tritanopia

322C2C
F47F86
AD7174
0A0909
6C4042

Achromatopsia

2F2F2F
CECECE
9B9B9B
0A0A0A
585858

Shades & Tints Shades & Tints

#322F29

Dark
Light

#F6D53E

Dark
Light

#AEA14C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #322f29;
  --color-2: #f6d53e;
  --color-3: #aea14c;
  --color-4: #0a0a09;
  --color-5: #6d562f;
}

SCSS

$color-1: #322f29;
$color-2: #f6d53e;
$color-3: #aea14c;
$color-4: #0a0a09;
$color-5: #6d562f;

TAILWIND

colors: {
  'brand-1': '#322f29',
  'brand-2': '#f6d53e',
  'brand-3': '#aea14c',
  'brand-4': '#0a0a09',
  'brand-5': '#6d562f',
}

RGB Array

[50, 47, 41], [246, 213, 62], [174, 161, 76], [10, 10, 9], [109, 86, 47]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #322F29, #F6D53E, #AEA14C, #0A0A09, #6D562F 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 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #322f29; --color-2: #f6d53e; --color-3: #aea14c; --color-4: #0a0a09; --color-5: #6d562f. 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 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