CSS Named Color
Copy-ready color values
HEX
#F08080RGB
rgb(240, 128, 128)HSL
hsl(0, 79%, 72%)HSV
hsv(0, 47%, 94%)CMYK approx.
cmyk(0, 47, 47, 6)Color value table
| Format | Value | Copy |
|---|---|---|
| HEX | #F08080 | |
| RGB | rgb(240, 128, 128) | |
| HSL | hsl(0, 79%, 72%) | |
| HSV | hsv(0, 47%, 94%) | |
| CMYK approx. | cmyk(0, 47, 47, 6) | |
| CSS keyword | lightcoral |
Contrast and classification
LightLightness2.59:1Contrast with white8.10:1Contrast with blackMagenta / PurpleColor family
Shade and tint preview
White 10%#F28D8D
White 30%#F5A6A6
White 70%#FBD9D9
White 90%#FEF2F2
Black 10%#D87373
Black 30%#A85A5A
Black 70%#482626
Black 90%#180D0D
Harmony palettes
Complementary
#0F7F7F#499E9EAnalogous
#E3808D#F08080Triadic
#8080F0#80F080Split complementary
#3A9696#0C6868Using Lightcoral
Lightcoral works best when it is chosen with contrast, surrounding colors, and interface state in mind. Use the HEX value for static CSS, RGB when you need channel-level control, and HSL when adjusting lightness or saturation for hover states. The CMYK value is an approximate screen-to-print conversion, so print workflows should still rely on calibrated design software or a printer profile.
CSS, SCSS, and Tailwind examples
:root {
--color-lightcoral: #f08080;
}
.button-primary {
background: var(--color-lightcoral);
color: #000000;
}
$lightcoral: #f08080;
// Tailwind arbitrary value
class="bg-[#f08080] text-white"