Shades of Orange

Orange sits between red and yellow, covering roughly 15 to 45 degrees on the HSL color wheel. It is associated with warmth, energy, autumn, citrus and friendliness, and it is the most common accent color against blue interfaces.

34 named shades#FFA500rgb(255, 165, 0)hue 15° to 45°

34 orange colors, lightest to darkest

Click a swatch to copy its HEX code. Click the name for the full profile with HSL, LAB, OKLCH, harmonies and contrast.

Tints and shades of orange #FFA500

A perceptual 50 to 950 scale built from the pure orange. Same hue, stepped lightness.

FFF0D1FFE4B4FFCD81FFA500E89400C97900A56100844C00633600472400270F00

Build this scale from any color with the color scale tool, or get it as a Tailwind config from the Tailwind palette generator.

Light, medium and dark orange

Orange tints become peachy and soft, muted tones become earthy, and darker shades move toward burnt orange and brown. Classic examples include Peach Puff #FFDAB9, Dark Orange #FF8C00 and Chocolate #D2691E.

How to use orange in design

Orange is complemented by blue and sits naturally beside red and yellow in analogous palettes. Highly saturated oranges lose brightness in CMYK printing, so important brand colors should be checked using printed proofs or specified as a spot color. See what colors make orange.

FAQ

What is the HEX code for orange?

The standard CSS named orange is #FFA500. Its HSL hue is about 39 degrees.

What is a classic shade of orange?

Dark Orange #FF8C00 is a familiar saturated orange. Peach Puff #FFDAB9 is a much lighter option.

What colors go with orange?

Blue creates complementary contrast. Yellow, red, cream, brown, navy and neutral gray also pair naturally with orange.

Work with orange

Palettes from orange
Complementary, analogous and triadic schemes from any orange.
Orange text contrast
Check a orange against white, black or any background for WCAG.
Closest Pantone orange
Nearest Pantone references for a orange HEX code, ranked by Delta E.
Mix a orange
See what two colors make in paint, RGB or CMYK.
Orange gradients
Smooth two- and three-stop gradients in OKLCH.
All named colors
Browse every family with search and filters.

Learn more

Other color families