Using Orange Color Codes in Web Design
Orange pairs high visibility with an inviting tone, driving engagement without the immediate urgency of red. Vibrant oranges are ideal for conversion-focused action buttons, notification indicators, and active tab states, while softer terracotta shades add warm, modern character to editorial cards.
| Colour name | Hex code | RGB value | HSL value | Notes & Info | |
|---|---|---|---|---|---|
| Orange | #FFA500 | rgb(255, 165, 0) | hsl(39, 100%, 50%) | ||
| Dark Orange | #FF8C00 | rgb(255, 140, 0) | hsl(33, 100%, 50%) | ||
| Coral | #FF7F50 | rgb(255, 127, 80) | hsl(16, 100%, 66%) | ||
| Light Salmon | #FFA07A | rgb(255, 160, 122) | hsl(17, 100%, 74%) | ||
| Peach | #FFCBA4 | rgb(255, 203, 164) | hsl(26, 100%, 82%) | ||
| Papaya Whip | #FFEFD5 | rgb(255, 239, 213) | hsl(37, 100%, 92%) | ||
| Tangerine | #F28500 | rgb(242, 133, 0) | hsl(33, 100%, 47%) | ||
| Amber | #FFBF00 | rgb(255, 191, 0) | hsl(45, 100%, 50%) | ||
| Burnt Orange | #CC5500 | rgb(204, 85, 0) | hsl(25, 100%, 40%) | ||
| Rust | #B7410E | rgb(183, 65, 14) | hsl(18, 86%, 39%) | ||
| Safety Orange | #FF5F1F | rgb(255, 95, 31) | hsl(17, 100%, 56%) | ||
| Terracotta | #E2725B | rgb(226, 114, 91) | hsl(10, 70%, 62%) |