CSS named color

Orange #FFA500

Orange is a vivid orange with the hex code #FFA500, which converts to rgb(255, 165, 0). Open #FFA500 in the converter to tweak it.

Orange color values

How #FFA500 converts to RGB

Split the hex code into three pairs and read each pair as a base-16 number: FF → 255, A5 → 165, 00 → 0. That gives rgb(255, 165, 0). The step-by-step guide explains the math.

Shades of Orange

Mixed toward black in 10% steps. Click a swatch to copy its hex.

Tints of Orange

Mixed toward white in 10% steps.

Color harmonies

Hue rotations of Orange on the HSL color wheel, keeping saturation and lightness fixed. The color harmony guide explains when each scheme works.

Complementary

Analogous

Split-complementary

Triadic

Tetradic (square)

Contrast and accessibility

Use black text on a orange background. Test any other pair in the contrast checker; thresholds are explained in the WCAG contrast guide.

Use Orange in CSS

.element {
  color: orange;                         /* keyword */
  background-color: #FFA500;            /* hex */
  border-color: rgb(255 165 0 / 50%);    /* 50% transparent */
}

Need it semi-transparent? Append an alpha byte: #FFA50080 is Orange at 50% opacity. See RGBA & transparency.

Similar named colors

FAQ

What is the HEX code for Orange?

The CSS named color orange is #FFA500 in hexadecimal. In CSS you can write color: orange; or color: #FFA500; — both produce the same pixel.

What is Orange in RGB?

Orange is rgb(255, 165, 0): red 255, green 165, blue 0 on the 0–255 scale. As normalized 0–1 floats that is (1, 0.647, 0).

Is white or black text more readable on Orange?

Black text is more readable. White on #FFA500 has a contrast ratio of 1.97:1 (Fail), black on #FFA500 has 10.63:1 (AAA). WCAG AA needs 4.5:1 for normal text.