What does the color Orange mean?

Orange Color Name | colorBase

Orange

#ffa500

#ffb733

#ffc966

#ffdb99

#ffedcc

#e69e1a

Meaning

Creativity, enthusiasm, and friendliness. Approachable CTAs and lifestyle brands.

History

Orange is a standard CSS/SVG named color used across browsers since early web standards.

Usage

Use Orange (#ffa500) in CSS as color: orange; or as #ffa500.

Preview

Orange

#ffa500

Overview

Family: Orange

Accessibility on this swatch:

AAA

(10.63:1)

Contrast vs white: 1.97:1 · vs black: 10.63:1

Formats

HEX

#ffa500

RGB

rgb(255, 165, 0)

RGBA

rgba(255, 165, 0, 1)

HSL

hsl(39, 100%, 50%)

HSV

hsv(39, 100%, 100%)

LAB

lab(74.94% 23.93 78.95)

LCH

lch(74.94% 82.5 73.14)

OKLAB

oklab(0.7927 0.0566 0.1614)

OKLCH

oklch(0.7927 0.171 70.68)

XYZ

xyz(54.70, 48.18, 6.42)

CMYK

cmyk(0%, 35%, 100%, 0%)

CSS

color: #ffa500;

CSS variable

--color-ffa500: #ffa500;

SCSS

$color-ffa500: #ffa500;

Tailwind

red-500

Export

Developer code

:root {
  --orange-1: #ffa500;
}

Color psychology

Creativity, enthusiasm, and friendliness. Approachable CTAs and lifestyle brands.

Usage examples: primary buttons, chart series, status badges, marketing gradients, and brand accents in the Orange family.

Tints

Shades

Tones

Complementary

Analogous

Triadic

Split complementary

Monochromatic

Related shades & tints

#ffb733

#ffc966

#ffdb99

#ffedcc

#e69e1a

#cc9633

#b38f4d

#998766

Similar colors

#efa51a

#f2ac2c

#de9a12

#ec9122

#ff8c00

#df9c20

#f09b33

#f1b80e

Browse more in the color name library.