Orange
#ffa500
True orange with high-impact warmth, between gold and amber
About Orange
Orange is the slice of hard-walled brightness you see on a fresh-orange peel, not the softer, banana-leaning yellows nearby. Compared to Cheese, it backs off the red heat and reads cleaner and more distinctly orange, with a bit more lift and less "hot" saturation. Against Beer, it's not as gold and dense. It feels a touch more direct, like a label ink that stays legible without turning amber-thick.
I reach for it in food packaging and retail when you want energy that still looks orderly. It's great for e-commerce accents where you need orange presence, like promo badges, cart counters, and category headers, especially when the rest of the UI is light. The mood is upbeat and forward, not smoky or financially amber.
Pair it with charcoal, near-black, or cool grays for crisp contrast. On very warm displays it can drift a little toward yellow, so I usually sanity-check it against the product photography before committing.
Code snippets
Copy this color into your project.
Contrast checker
WCAG 2.1 contrast ratios. AA requires 4.5:1 for normal text, 3:1 for large. AAA requires 7:1 / 4.5:1.
On White #ffffff
On Gray 100 #f5f5f5
On Gray 900 #18181b
On Black #000000
Variations
Shades
Darker variations, created by mixing toward black.
Tints
Lighter variations, created by mixing toward white.
Tones
Muted variations, created by reducing saturation.
Hues
Hue rotations around the color wheel.
Temperatures
Warm and cool shifts of this color.
Color harmonies
Suggested palettes
Palettes built around this color.
Community palettes
Published palettes that include this color.