← Back to Editor

#FFAA22 · #CC9911 · #FF5555 · #FF1166

neon

A 4-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

#FFAA22

Ginger · Orange · Warm Sun

HEX
#FFAA22
RGB
rgb(255, 170, 34)
HSL
hsl(37, 100%, 57%)
HSB
hsb(37, 87%, 100%)
CMYK
cmyk(0%, 33%, 87%, 0%)
Oklch
oklch(80.2% 0.165 71.6)

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

#CC9911

Ochre · GoldenRod · Honey Gold

HEX
#CC9911
RGB
rgb(204, 153, 17)
HSL
hsl(44, 85%, 43%)
HSB
hsb(44, 92%, 80%)
CMYK
cmyk(0%, 25%, 92%, 20%)
Oklch
oklch(71.2% 0.143 84.0)

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

#FF5555

Peach Pink · Tomato · Coral Red

HEX
#FF5555
RGB
rgb(255, 85, 85)
HSL
hsl(0, 100%, 67%)
HSB
hsb(0, 67%, 100%)
CMYK
cmyk(0%, 67%, 67%, 0%)
Oklch
oklch(68.2% 0.206 24.4)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#FF1166

Dark Violet · DeepPink · Rose Pink

HEX
#FF1166
RGB
rgb(255, 17, 102)
HSL
hsl(339, 100%, 53%)
HSB
hsb(339, 93%, 100%)
CMYK
cmyk(0%, 93%, 60%, 0%)
Oklch
oklch(64.2% 0.252 11.0)

Traditional「Dark Violet」· Paint「Rose Pink」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FFAA22
2478FF

Analogous

FF3D24
FFAA22
E5FF24

Triadic

FFAA22
24FFAB
AB24FF

Split-Comp.

FFAA22
24E5FF
3D24FF

Tetradic

FFAA22
24FF3D
2478FF
FF24E5

Contrast Matrix WCAG 2.1 Contrast

FFAA22
CC9911
FF5555
FF1166
—
1.4
Fail
1.6
Fail
2.0
Fail
1.4
Fail
—
1.2
Fail
1.5
Fail
1.6
Fail
1.2
Fail
—
1.2
Fail
2.0
Fail
1.5
Fail
1.2
Fail
—
White BG
1.9Fail
2.6Fail
3.1AA Large
3.8AA Large
Black BG
11.0AAA
8.1AAA
6.7AA
5.5AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

DAD943
B6B532
B5B455
989651

Deuteranopia

DFE64B
B9BD3A
BFCC55
A6B84C

Tritanopia

FB5D63
C94C52
F75555
F3413E

Achromatopsia

B4B4B4
999999
888888
626262

Shades & Tints Shades & Tints

#FFAA22

Dark
Light

#CC9911

Dark
Light

#FF5555

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ffaa22;
  --color-2: #cc9911;
  --color-3: #ff5555;
  --color-4: #ff1166;
}

SCSS

$color-1: #ffaa22;
$color-2: #cc9911;
$color-3: #ff5555;
$color-4: #ff1166;

TAILWIND

colors: {
  'brand-1': '#ffaa22',
  'brand-2': '#cc9911',
  'brand-3': '#ff5555',
  'brand-4': '#ff1166',
}

RGB Array

[255, 170, 34], [204, 153, 17], [255, 85, 85], [255, 17, 102]

FAQ FAQ

What scenarios is this 4-color palette suitable for?

This neon-style palette of #FFAA22, #CC9911, #FF5555, #FF1166 is ideal for: social media posters, mobile apps, e-commerce promos. Vivid colors effectively attract user attention. It is a vibrant and energetic choice among 4-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #ffaa22; --color-2: #cc9911; --color-3: #ff5555; --color-4: #ff1166. 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 4-color scheme is especially suited for food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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