Orange color codes
| CSS name | orange |
|---|---|
| HEX | #FFA500 |
| RGB | rgb(255, 165, 0) |
| HSL | hsl(39, 100%, 50%) |
| CMYK | cmyk(0%, 35%, 100%, 0%) |
| Decimal | 16753920 |
Shades of Orange (darker)
#E69500 · #CC8400 · #B37400 · #996300 · #805300 · #664200 · #4D3200 · #332100 · #1A1100
Tints of Orange (lighter)
#FFAE1A · #FFB733 · #FFC04D · #FFC966 · #FFD280 · #FFDB99 · #FFE4B3 · #FFEDCC · #FFF6E6
Color harmonies
| Complementary | #0059FF |
|---|---|
| Triadic | #00FFA6, #A600FF |
| Analogous | #FF2600, #D9FF00 |
Accessibility (WCAG contrast)
| White text on Orange | 1.97:1 · Fail |
|---|---|
| Black text on Orange | 10.63:1 · AAA |
Use Orange in code
.element {
color: orange; /* or #ffa500 */
background-color: rgb(255 165 0 / 0.5);
}Frequently asked questions
What is the hex code for Orange?
Orange is #FFA500 in HEX, rgb(255, 165, 0) in RGB and hsl(39, 100%, 50%) in HSL.
Can I use "orange" directly in CSS?
Yes. "orange" is one of the 148 standard CSS named colors, so color: orange; works in every browser.
Is Orange readable on white?
The contrast ratio of Orange on white is 1.97:1 (WCAG Fail). On black it is 10.63:1 (AAA).
What is the complementary color of Orange?
The complementary color (opposite on the color wheel) is #0059FF.
Similar colors
Dark Orange#FF8C00Goldenrod#DAA520Gold#FFD700Dark Goldenrod#B8860BChocolate#D2691EPeru#CD853FCoral#FF7F50Yellow#FFFF00
Convert any color with the Color Converter, generate palettes with the Random Color Generator, or browse all 148 CSS color names.