HEX Color #FF5F16 (Orangered)

About #FF5F16

The hex code #FF5F16 represents a beautifully specific shade of orange. It is closely associated with the named CSS color Orangered. To achieve this exact tint on a monitor, you would use an RGB mix of 255, 95, and 22.

For print applications, it's crucial to understand its CMYK makeup. Its ink density profile breaks down to 0% cyan, 63% magenta, 91% yellow, and 0% black. The HSL representation is 18.8° hue, 100.0% saturation, and 54.3% lightness.

Web Content Accessibility Guidelines (WCAG) dictate how we should use this color. Mathematical luminance calculations suggest that #000000 text provides the most optimal reading experience. Be sure to check our contrast matrix below to see exactly how it performs against common backgrounds.

Color Space Conversions

HEX#FF5F16

RGB255, 95, 22

HSL18.8°, 100.0%, 54.3%

CMYK0%, 63%, 91%, 0%

HSV18.8°, 91.4%, 100.0%

LAB61.2, 58.2, 66.3

XYZ45.5, 29.5, 4.1

Decimal16736022

Color Harmonies

Complementary

#FF5F16 #16B5FE

Analogous

#FE1641 #FED316

Triadic

#16FE5F #5E16FE

Tetradic

#41FE16 #16B5FE #D316FE

Tints, Shades & Tones

Tints (Adding White)

#FF5F16

#FF702F

#FF8249

#FF9463

#FFA67D

#FFB797

#FFC9B1

#FFDBCB

#FFEDE5

#FFFFFF

Shades (Adding Black)

#FF5F16

#E25413

#C64911

#AA3F0E

#8D340C

#712A09

#551F07

#381504

#1C0A02

#000000

WCAG Contrast Accessibility

3.04:1

Text on #FFFFFF

AA Large

6.90:1

Text on #000000

AA

2.91:1

Text on #F8FAFC

FAIL

5.87:1

Text on #0F172A

AA

CSS Implementation

.bg-color { background-color: #FF5F16; }

.text-color { color: #FF5F16; }

.border-color { border: 2px solid #FF5F16; }

Similar Colors

Orangered

#FF4500