← Back to Editor

#322F42 · #A86141 · #B08F7C · #AAB08A · #AAC2A0

neon

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

FuturisticEnergeticRebelliousWarmCool

Industry INDUSTRY

GamingWeb3 / CryptoDeep Tech

UI Context UI CONTEXT

Dark Mode UIDashboardCampaign PageData Visualization

Color Details Color Details

#322F42

Deep Indigo · DarkSlateGray · Prussian Blue

HEX
#322F42
RGB
rgb(50, 47, 66)
HSL
hsl(249, 17%, 22%)
HSB
hsb(249, 29%, 26%)
CMYK
cmyk(24%, 29%, 0%, 74%)
Oklch
oklch(31.7% 0.034 291.6)

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

#A86141

Tangerine · Sienna · Amber Brown

HEX
#A86141
RGB
rgb(168, 97, 65)
HSL
hsl(19, 44%, 46%)
HSB
hsb(19, 61%, 66%)
CMYK
cmyk(0%, 42%, 61%, 34%)
Oklch
oklch(56.6% 0.103 44.4)

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

#B08F7C

Tangerine · Gray · Warm Sun

HEX
#B08F7C
RGB
rgb(176, 143, 124)
HSL
hsl(22, 25%, 59%)
HSB
hsb(22, 30%, 69%)
CMYK
cmyk(0%, 19%, 30%, 31%)
Oklch
oklch(67.6% 0.049 51.5)

Traditional「Tangerine」· Paint「Warm Sun」· Creative Blush Sunrise

#AAB08A

Fresh Green · DarkSeaGreen · Sunflower

HEX
#AAB08A
RGB
rgb(170, 176, 138)
HSL
hsl(69, 19%, 62%)
HSB
hsb(69, 22%, 69%)
CMYK
cmyk(3%, 0%, 22%, 31%)
Oklch
oklch(74.2% 0.053 115.0)

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

#AAC2A0

Celadon · DarkGray · Apple Green

HEX
#AAC2A0
RGB
rgb(170, 194, 160)
HSL
hsl(102, 22%, 69%)
HSB
hsb(102, 18%, 76%)
CMYK
cmyk(12%, 0%, 18%, 24%)
Oklch
oklch(78.7% 0.054 136.5)

Traditional「Celadon」· Paint「Apple Green」· Creative Mint Breeze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

322F42
3F422F

Analogous

2F3542
322F42
3B2F42

Triadic

322F42
42312F
2F4231

Split-Comp.

322F42
423B2F
35422F

Tetradic

322F42
422F35
3F422F
2F423B

Contrast Matrix WCAG 2.1 Contrast

322F42
A86141
B08F7C
AAB08A
AAC2A0
—
2.7
Fail
4.4
AA Large
5.7
AA
6.7
AA
2.7
Fail
—
1.6
Fail
2.1
Fail
2.5
Fail
4.4
AA Large
1.6
Fail
—
1.3
Fail
1.5
Fail
5.7
AA
2.1
Fail
1.3
Fail
—
1.2
Fail
6.7
AA
2.5
Fail
1.5
Fail
1.2
Fail
—
White BG
13.0AAA
4.7AA
3.0Fail
2.3Fail
1.9Fail
Black BG
1.6Fail
4.5AA Large
7.1AAA
9.3AAA
10.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

31313D
898949
A2A181
ADAD93
B4B5A8

Deuteranopia

31313C
8D934B
A4A682
ACAC95
B3B1AA

Tritanopia

323A39
A44F50
AE8485
AA9A9C
ABAFB0

Achromatopsia

323232
737373
979797
AAAAAA
B7B7B7

Shades & Tints Shades & Tints

#322F42

Dark
Light

#A86141

Dark
Light

#B08F7C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #322f42;
  --color-2: #a86141;
  --color-3: #b08f7c;
  --color-4: #aab08a;
  --color-5: #aac2a0;
}

SCSS

$color-1: #322f42;
$color-2: #a86141;
$color-3: #b08f7c;
$color-4: #aab08a;
$color-5: #aac2a0;

TAILWIND

colors: {
  'brand-1': '#322f42',
  'brand-2': '#a86141',
  'brand-3': '#b08f7c',
  'brand-4': '#aab08a',
  'brand-5': '#aac2a0',
}

RGB Array

[50, 47, 66], [168, 97, 65], [176, 143, 124], [170, 176, 138], [170, 194, 160]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This neon-style palette of #322F42, #A86141, #B08F7C, #AAB08A, #AAC2A0 is ideal for: brand design, premium product pages, magazine layouts, 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: #322f42; --color-2: #a86141; --color-3: #b08f7c; --color-4: #aab08a; --color-5: #aac2a0. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. 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 neon-style 5-color scheme is especially suited for tech, SaaS, healthcare, eco 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