← Back to Editor

#E3A958 · #B8A4A1 · #CCA773 · #E3A245 · #BFB1B3

neon

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

FuturisticEnergeticRebelliousWarm

Industry INDUSTRY

GamingWeb3 / CryptoDeep Tech

UI Context UI CONTEXT

Dark Mode UIDashboardCampaign Page

Color Details Color Details

#E3A958

Ginger · SandyBrown · Warm Sun

HEX
#E3A958
RGB
rgb(227, 169, 88)
HSL
hsl(35, 71%, 62%)
HSB
hsb(35, 61%, 89%)
CMYK
cmyk(0%, 26%, 61%, 11%)
Oklch
oklch(77.3% 0.119 73.5)

TraditionalGinger」· PaintWarm Sun」· Creative Honey Glow

#B8A4A1

Peach Pink · DarkGray · Coral Red

HEX
#B8A4A1
RGB
rgb(184, 164, 161)
HSL
hsl(8, 14%, 68%)
HSB
hsb(8, 13%, 72%)
CMYK
cmyk(0%, 11%, 13%, 28%)
Oklch
oklch(73.5% 0.024 27.9)

TraditionalPeach Pink」· PaintCoral Red」· Creative Blush Sunrise

#CCA773

Ginger · Tan · Warm Sun

HEX
#CCA773
RGB
rgb(204, 167, 115)
HSL
hsl(35, 47%, 63%)
HSB
hsb(35, 44%, 80%)
CMYK
cmyk(0%, 18%, 44%, 20%)
Oklch
oklch(75.0% 0.081 75.4)

TraditionalGinger」· PaintWarm Sun」· Creative Honey Glow

#E3A245

Ginger · SandyBrown · Warm Sun

HEX
#E3A245
RGB
rgb(227, 162, 69)
HSL
hsl(35, 74%, 58%)
HSB
hsb(35, 70%, 89%)
CMYK
cmyk(0%, 29%, 70%, 11%)
Oklch
oklch(75.8% 0.132 72.9)

TraditionalGinger」· PaintWarm Sun」· Creative Blush Sunrise

#BFB1B3

Peach Pink · Silver · Coral Red

HEX
#BFB1B3
RGB
rgb(191, 177, 179)
HSL
hsl(351, 10%, 72%)
HSB
hsb(351, 7%, 75%)
CMYK
cmyk(0%, 7%, 6%, 25%)
Oklch
oklch(77.3% 0.016 7.6)

TraditionalPeach Pink」· PaintCoral Red」· Creative Rose Petal

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E3A958
5993E3

Analogous

E36559
E3A958
D7E359

Triadic

E3A958
59E3AA
AA59E3

Split-Comp.

E3A958
59D7E3
6559E3

Tetradic

E3A958
59E365
5993E3
E359D7

Contrast Matrix WCAG 2.1 Contrast

E3A958
B8A4A1
CCA773
E3A245
BFB1B3
1.1
Fail
1.1
Fail
1.1
Fail
1.0
Fail
1.1
Fail
1.1
Fail
1.1
Fail
1.1
Fail
1.1
Fail
1.1
Fail
1.0
Fail
1.1
Fail
1.1
Fail
1.1
Fail
1.0
Fail
1.1
Fail
1.0
Fail
1.1
Fail
1.1
Fail
1.1
Fail
White BG
2.1Fail
2.4Fail
2.2Fail
2.2Fail
2.1Fail
Black BG
10.1AAA
8.9AAA
9.3AAA
9.5AAA
10.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

CAC96C
AFAFA2
BCBC80
C7C65C
B9B9B3

Deuteranopia

CDD270
B1B2A2
BEC183
CBCF61
BABBB2

Tritanopia

E07B7E
B7A2A2
CA8A8C
E06D71
BEB2B2

Achromatopsia

B1B1B1
AAAAAA
ACACAC
ABABAB
B5B5B5

Shades & Tints Shades & Tints

#E3A958

Dark
Light

#B8A4A1

Dark
Light

#CCA773

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e3a958;
  --color-2: #b8a4a1;
  --color-3: #cca773;
  --color-4: #e3a245;
  --color-5: #bfb1b3;
}

SCSS

$color-1: #e3a958;
$color-2: #b8a4a1;
$color-3: #cca773;
$color-4: #e3a245;
$color-5: #bfb1b3;

TAILWIND

colors: {
  'brand-1': '#e3a958',
  'brand-2': '#b8a4a1',
  'brand-3': '#cca773',
  'brand-4': '#e3a245',
  'brand-5': '#bfb1b3',
}

RGB Array

[227, 169, 88], [184, 164, 161], [204, 167, 115], [227, 162, 69], [191, 177, 179]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This neon-style palette of #E3A958, #B8A4A1, #CCA773, #E3A245, #BFB1B3 is ideal for: corporate websites, product showcases, portfolios. 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: #e3a958; --color-2: #b8a4a1; --color-3: #cca773; --color-4: #e3a245; --color-5: #bfb1b3. 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. 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. 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