Maroon Colors  ·  Color Library

Palettes / Colors / #FF500A

#FF500A — Vivid Orange

#FF500A is a orange color we call Vivid Orange, closest to the named color OrangeRed (#FF4500). It belongs to the orange family.

#FF500A is a warm orange color associated with warmth, appetite and friendliness. It is saturated enough to be the accent — buttons, highlights and calls to action — while neutrals do the quiet work around it.

Its strongest partner is its complement #0ABAFF; it also sits naturally between #FF0A3F and #FFCA0A. In the palettes below you can see it working alongside real color combinations from our collection.

#FF500A · RGB 255, 80, 10

Download PNG swatch SVG

Color values

HEX#FF500A
RGB255, 80, 10
HSL17°, 100%, 52%
HSV17°, 96%, 100%
CMYK0%, 69%, 96%, 0%
XYZ44.16, 27.02, 3.17
Yxy27.02, 0.5939, 0.3634
CIE-Lab58.99, 64.03, 67.74
Hunter Lab51.98, 64.48, 31.09

RGB & CMYK percentages

Red 100% · Green 31% · Blue 4%

Cyan 0% · Magenta 69% · Yellow 96% · Key 0%

CMYK values are unprofiled approximations for screen reference — not a print-proofing guarantee.

Previews

Sample text in #FF500A on black
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Sample text in #FF500A on white
Lorem ipsum dolor sit amet, consectetur adipiscing elit.

CSS code for #FF500A

.text { color: #FF500A; }
.background { background-color: #FF500A; }
.border { border: 3px solid #FF500A; }
.text-rgb { color: rgb(255, 80, 10); }
.text-hsl { color: hsl(17, 100%, 52%); }
.text-shadow-hex { text-shadow: 4px 4px 2px #FF500A; }
.text-shadow-rgba { text-shadow: 4px 4px 2px rgba(255, 80, 10, 0.8); }
.box-shadow-hex { box-shadow: 1px 1px 3px 2px #FF500A; }
.box-shadow-rgba { box-shadow: 1px 1px 3px 2px rgba(255, 80, 10, 0.8); }

HTML: <p style="color:#FF500A">Text here</p> · <div style="background-color:#FF500A">Div content here</div>

Shades of #FF500A

#F04400#D63D00#C23700#A83000#8F2800#752100#5C1A00#471400#2E0D00#140600

Tints of #FF500A

#FF5E1F#FF7038#FF7F4D#FF9166#FFA07A#FFAF8F#FFC1A8#FFCFBD#FFE2D6#FFF0EB

Tones of #FF500A

#EE571B#DC5F2E#CA663F#B96E50#A87561#967D73

Color harmonies

Complementary — #0ABAFF:

Analogous:

Triadic:

Contrast & accessibility

Against white text3.28:1 AA large only
Against black text6.40:1 AA

Best text color on #FF500A: #000000.

How #FF500A looks with color blindness

Simulated with standard Machado color-vision-deficiency matrices — useful when this color carries meaning in charts, maps or interfaces:

Protanopia · #B3B21BDeuteranopia · #BDCB1FTritanopia · #F6282B

Closest design-system colors

The nearest matches in the Tailwind CSS, Material Design and Bootstrap palettes — handy when you need a framework class instead of a raw hex:

Tailwind orange 600 · #EA580CMaterial Deep Orange 500 · #FF5722Tailwind orange 500 · #F97316

Palettes with a similar color

These palettes use a close neighbour of #FF500A rather than the exact color:

Palette 03a6a1
#03A6A1 · #FFE3BB · #FFA673 · #FF4F0F
Palette F7f7f7
#F7F7F7 · #FF570C · #606470 · #323643
Palette F7fd04
#F7FD04 · #F9B208 · #F98404 · #FC5404
Palette 900c3f
#900C3F · #C70039 · #F94C10 · #F8DE22
Palette 443737
#443737 · #272121 · #FF0000 · #FF4D00
Palette C00707
#C00707 · #FF4400 · #FFB33F · #134E8E

Similar colors

The closest colors that actually appear in our palette collection — click any to open its page:

#FF4F0F#FF570C#FC5404#F94C10#FF4D00#FF4400#F84715#EE5007#F25912#FF5F00#F14A00#FC4100

Browse neighbouring colors

← #FF5009  ·  #FF500B →

Frequently asked questions

What color is #FF500A?

#FF500A is Vivid Orange, a orange color (RGB 255, 80, 10). Its closest standard named color is OrangeRed.

What is the RGB and HSL of #FF500A?

#FF500A is RGB 255, 80, 10 — HSL 17°, 100%, 52% — CMYK 0%, 69%, 96%, 0%.

What colors go with #FF500A?

Its complement is #0ABAFF; analogous partners are #FF0A3F and #FFCA0A. It also appears in 6+ palettes in our collection.

Can I use #FF500A for text?

Black text on #FF500A has a contrast ratio of 6.40:1 (passes WCAG AA); white text gives 3.28:1.