#474E40 + #343A2B + #C4F10D + #CCFC0F + #22271C · neon - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

FuturisticEnergeticRebellious

Industry INDUSTRY

GamingWeb3 / CryptoDeep Tech

UI Context UI CONTEXT

Dark Mode UIDashboardCampaign Page

Color Details Color Details

#474E40

Celadon · DarkSlateGray · Forest Green

HEX

#474E40

RGB

rgb(71, 78, 64)

HSL

hsl(90, 10%, 28%)

HSB

hsb(90, 18%, 31%)

CMYK

cmyk(9%, 0%, 18%, 69%)

Oklch

oklch(41.3% 0.024 129.1)

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

#343A2B

Grass Green · DarkSlateGray · Dark Green

HEX

#343A2B

RGB

rgb(52, 58, 43)

HSL

hsl(84, 15%, 20%)

HSB

hsb(84, 26%, 23%)

CMYK

cmyk(10%, 0%, 26%, 77%)

Oklch

oklch(33.8% 0.027 125.5)

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

#C4F10D

Grass Green · GreenYellow · Olive Green

HEX

#C4F10D

RGB

rgb(196, 241, 13)

HSL

hsl(72, 90%, 50%)

HSB

hsb(72, 95%, 95%)

CMYK

cmyk(19%, 0%, 95%, 5%)

Oklch

oklch(89.4% 0.216 122.4)

Traditional「Grass Green」· Paint「Olive Green」· Creative Blush Sunrise

#CCFC0F

Grass Green · GreenYellow · Olive Green

HEX

#CCFC0F

RGB

rgb(204, 252, 15)

HSL

hsl(72, 98%, 52%)

HSB

hsb(72, 94%, 99%)

CMYK

cmyk(19%, 0%, 94%, 1%)

Oklch

oklch(92.4% 0.224 122.6)

Traditional「Grass Green」· Paint「Olive Green」· Creative Blush Sunrise

#22271C

Grass Green · Black · Dark Green

HEX

#22271C

RGB

rgb(34, 39, 28)

HSL

hsl(87, 16%, 13%)

HSB

hsb(87, 28%, 15%)

CMYK

cmyk(13%, 0%, 28%, 85%)

Oklch

oklch(26.4% 0.021 127.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

474E40

47404F

Analogous

4F4F40

474E40

404F40

Triadic

474E40

40474F

4F4047

Split-Comp.

474E40

40404F

4F404F

Tetradic

474E40

404F4F

47404F

4F4040

Contrast Matrix WCAG 2.1 Contrast

474E40	343A2B	C4F10D	CCFC0F	22271C
—	1.4 Fail	6.6 AA	7.2 AAA	1.8 Fail
1.4 Fail	—	8.9 AAA	9.8 AAA	1.3 Fail
6.6 AA	8.9 AAA	—	1.1 Fail	11.6 AAA
7.2 AAA	9.8 AAA	1.1 Fail	—	12.7 AAA
1.8 Fail	1.3 Fail	11.6 AAA	12.7 AAA	—

White BG

8.6AAA

11.8AAA

1.3Fail

1.2Fail

15.3AAA

Black BG

2.4Fail

1.8Fail

15.9AAA

17.5AAA

1.4Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

4A4A43

37372F

D7D844

E1E148

24241F

Deuteranopia

4A4944

363630

D5D251

DEDA56

24241F

Tritanopia

474647

343132

C67079

CE7680

222121

Achromatopsia

4A4A4A

363636

CACACA

D3D3D3

242424

Shades & Tints Shades & Tints

#474E40

Dark

Light

#343A2B

Dark

Light

#C4F10D

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #474e40;
  --color-2: #343a2b;
  --color-3: #c4f10d;
  --color-4: #ccfc0f;
  --color-5: #22271c;
}

SCSS

$color-1: #474e40;
$color-2: #343a2b;
$color-3: #c4f10d;
$color-4: #ccfc0f;
$color-5: #22271c;

TAILWIND

colors: {
  'brand-1': '#474e40',
  'brand-2': '#343a2b',
  'brand-3': '#c4f10d',
  'brand-4': '#ccfc0f',
  'brand-5': '#22271c',
}

RGB Array

[71, 78, 64], [52, 58, 43], [196, 241, 13], [204, 252, 15], [34, 39, 28]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This neon-style palette of #474E40, #343A2B, #C4F10D, #CCFC0F, #22271C is ideal for: tech websites, dark mode UIs, game UIs. 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: #474e40; --color-2: #343a2b; --color-3: #c4f10d; --color-4: #ccfc0f; --color-5: #22271c. 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. 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