Figma color wheel
Want to find the perfect complementary or analogous colors to match neon orange?
Skip to main content
Everything you need to know about neon orange to inspire your next design.
Neon orange is a vivid and warm orange shade characterized by its high energy and vibrancy. Positioned between red and orange on the color wheel, this color is reminiscent of citrus fruits and sun-drenched summer days.

Shades
Tints
Tones
Hues
Complementary
Split
Monochromatic
Analogous
Triadic
Square
Psychedelic Punch
Thrift
Hot Sauce
Neon orange is defined by the following color codes and values to ensure consistency across various digital platforms and devices.
Accessibility considerations play a crucial role in UX and UI design color choices. Figma offers plugins in the Community to make sure your designs meet Web Content Accessibility Guidelines.
Here are some ways to use neon orange in your designs:
Keep in mind that color and its meaning can change from culture to culture—and at any given time. If you are designing for a global audience, research color considerations for your specific regions.
For variations within the same bright spectrum as neon orange, consider:
To complement neon orange, consider pairing it with:
Other colors that complement neon orange include navy blue for a classic contrast, lavender for a light and lively palette, and gray to emphasize neon orange’s brightness.
While neon orange is bright, it may clash with:
Neon orange symbolizes enthusiasm and confidence. Its bright but warm nature also carries connotations of fun, playfulness, and creativity.
In color psychology, neon orange evokes assertiveness. Its boldness demands attention, suggesting a willingness to take risks.
In UI design, neon orange can grab attention, making it a great color for CTAs. However, neon orange’s intensity may overwhelm a user in large quantities. Be sure to use neon orange strategically to avoid creating an overstimulating interface.
Neon orange was created in 1910 by French engineer Georges Claude, who invented neon lighting. The first neon lights used neon gas, which produced a distinct reddish-orange glow.
Neon’s popularity grew alongside the rise of urban cities. You can still find it used in the reflective vests worn by construction and safety workers. Neon orange gained prominence in fashion, design, and advertising during the 1980s. Its association with energy, vibrancy, and modernity made it a popular choice in a culture that embraced bold aesthetics.
Contrast 3.1
#FF5C00
How you design, align, and build matters. Do it together with Figma.
| Category | ||
|---|---|---|
Fail | Fail | |
Pass | Fail | |
Pass | Fail |
Contrast 6.78
#FF5C00
How you design, align, and build matters. Do it together with Figma.
| Category | ||
|---|---|---|
Pass | Fail | |
Pass | Pass | |
Pass | Pass |
Protanopia
Deuteranopia
Tritanopia
Achromatopsia
The hexadecimal color #FF5C00, known as neon orange, has RGB values of R:255, G:92, B:0 and CMYK values of C:0, M:64, Y:100, K:0.
| VALUE | CSS | |
|---|---|---|
| HEX | FF5C00 | #FF5C00 |
| RGB DECIMAL | 255, 92, 0 | RGB(255,92,0) |
| RGB PERCENTAGE | 100, 36.1, 0 | RGB(100%,36.1%,0%) |
| CMYK | 0, 64, 100, 0 | |
| HSL | 21.6°, 100, 50 | HSL(21.6,100%,50%) |
| HSV (OR HSB) | 21.6°, 100, 100 | |
| WEB SAFE | FF6600 | #FF6600 |
| CIE-LAB | 60.71, 59.249, 70.482 | |
| XYZ | 45.069, 28.919, 3.209 | |
| xyY | 0.584, 0.375, 28.919 | |
| CIE-LCH | 60.71, 92.077, 49.949 | |
| CIE-LUV | 60.71, 135.127, 50.891 | |
| HUNTER-LAB | 53.777, 55.488, 34.106 | |
| BINARY | 11111111, 01011100, 00000000 | |
| iOS - SwiftUI | Color(red: 1, green: 0.361, blue: 0) | |
| iOS - UIKit | UIColor(red: 1, green: 0.361, blue: 0, alpha: 1) | |
| Android - Compose | Color(0xFFFF5C00) |
Want to find the perfect complementary or analogous colors to match neon orange?
Discover the playful energy of bright orange.
Learn more about the color rose.