Shade of Amber
Intense, vibrant amber with bold energy
Shade of Amber is a high-octane, saturated orange that demands attention. Because of its intensity, it works best as a 10% accent color for calls to action or UI highlights rather than a full-page background. Pair it with deep charcoal or slate greys to temper its boldness and maintain readability. The hex code #ff7e00 provides enough contrast to support black text at standard sizes.
About Shade of Amber
A pumpkin split open, still warm from the field
What does shade of amber mean?
This saturated orange often signals heat, harvest, and warning. Full saturation and a bright midtone make it feel loud and hot, and it pulls the eye before anything else on the page.
Where you see shade of amber
- traffic cones
- safety vests
- tangerine peel
- marigold petals
- monarch butterfly wings
- marmalade
What it works for
Use it for calls to action, sports branding, and food packaging, then let quieter colors carry the rest of the design.
What colors go with shade of amber?
Teal #008080Teal sits nearly opposite on the wheel, so both colors read at full strength.Cream #fffdd0Cream softens the blast without dulling it, a mix that reads retro and warm.Charcoal #36454fCharcoal absorbs some of the noise and gives the orange room to carry the message.Deep Purple #36013fThe cool depth balances the heat and makes both colors feel richer than alone.
Questions about Shade of Amber
What is the hex code for Shade of Amber?
Shade of Amber is #ff7e00. In RGB that is rgb(255, 126, 0), in HSL hsl(30, 100%, 50%) and in CMYK 0%, 51%, 100%, 0%.
How do I use #ff7e00 in design without it becoming overwhelming?
Limit #ff7e00 to small, high-impact areas like buttons or notification badges, keeping its usage under 10% of your total layout. It pairs well with charcoal or deep slate tones, which effectively ground its intensity and prevent it from clashing with other interface elements.
Is Shade of Amber readable on white or black?
Shade of Amber has a 2.54:1 contrast ratio on white and 8.23:1 on black. WCAG asks for 4.5:1 for body text and 3:1 for large text, so on white it is too faint for text and on black it works for body text. Try other pairs in the contrast checker.