Scarlet is a medium, vivid shade in the red color family, with a warm feel. Its HEX code is #FF2400, which equals rgb(255, 36, 0) in RGB and hsl(8, 100%, 50%) in HSL. In print terms it converts to roughly C0 M86 Y100 K0, although exact CMYK results depend on the paper and color profile.
- HEX
#FF2400 - RGB
255, 36, 0 - HSL
8°, 100%, 50% - CMYK
0, 86, 100, 0 - Family
Red - Tone
Medium, vivid
About Scarlet
Red shades carry energy, urgency and passion. They draw the eye first, which makes them a favorite for calls to action, sale banners, alerts and brands that want to feel bold. Designers often reach for it as an accent, a button color or a background tint. Text in black is the most readable choice on this color, with a contrast ratio of 5.50:1. Its complementary color is #00DDFF.
Download Scarlet as an image
Choose a size and format, then download a solid-color image — or tick colors in the library to batch-download a ZIP.
Loading colors…
Loading gradients…
Scarlet color codes
| HEX | #FF2400 |
|---|---|
| RGB | rgb(255, 36, 0) |
| HSL | hsl(8, 100%, 50%) |
| HSV | 8°, 100%, 100% |
| CMYK | 0%, 86%, 100%, 0% |
| Decimal | 16720896 |
Shades and tints of Scarlet
Lighter tints are mixed with white and darker shades are mixed with black.
- 50
#FFDBD5 - 100
#FFB6AA - 200
#FF9280 - 300
#FF6D55 - 400
#FF492B - 500
#FF2400 - 600
#D51E00 - 700
#AA1800 - 800
#801200 - 900
#550C00 - 950
#2B0600
Color harmonies for Scarlet
- Complementary
#00DDFF≈ Pure Lagoon - Analogous −30°
#FF005D≈ Pure Carmine - Analogous +30°
#FFA200≈ Orange - Triadic +120°
#00FF22≈ Pure Kelly - Triadic +240°
#2200FF≈ Pure Ultramarine - Split 150°
#00FFA2≈ Pure Seafoam - Split 210°
#005EFF≈ Pure Cornflower
Contrast and accessibility of Scarlet
| Text color | Sample | Contrast ratio | WCAG |
|---|---|---|---|
| White text on Scarlet | Aa | 3.82:1 | AA Large only |
| Black text on Scarlet | Aa | 5.50:1 | AA (good) |
CSS code for Scarlet
background-color: #FF2400;color: #FF2400;background-color: rgb(255, 36, 0);background-color: hsl(8, 100%, 50%);:root { --color-scarlet: #FF2400; }class="bg-[#FF2400]"Colors similar to Scarlet
- Pure Scarlet
#FF1A00 - Pure Vermilion
#FF3300 - Medium Light Red
#FF2929 - Bright Scarlet
#E62E19 - Bright Red
#E61919 - Orange Red
#FF4500 - Medium Dark Vermilion
#D62B00 - Red
#FF0000 - Medium Dark Scarlet
#D61500 - Medium Light Scarlet
#FF3E29 - Pure Cardinal
#FF001A - Bright Cardinal
#E6192E
More red shades
- Red
#FF0000 - Rosy Brown
#BC8F8F - Burgundy
#800020 - Vermilion
#E34234 - Terracotta
#E2725B - Cinnabar
#E44D2E - Carmine
#960018 - Cardinal
#C41E3A - Blush
#DE5D83 - Chestnut
#954535 - Darkest Red
#330000
Frequently asked questions
What is the HEX code for Scarlet?
The HEX code for Scarlet is #FF2400.
What is the RGB value of Scarlet?
Scarlet has an RGB value of 255, 36, 0 (rgb(255, 36, 0)). In HSL it is 8°, 100%, 50%.
What text color should I use on Scarlet?
Use black text on Scarlet. White text has a contrast ratio of 3.82:1 and black text has 5.50:1; WCAG AA requires at least 4.5:1 for normal text.
What color goes well with Scarlet?
The complementary color of Scarlet is #00DDFF. Analogous colors #FF005D and #FFA200 also pair well.
