CSS Named Color
Copy-ready color values
HEX
#FAF0E6RGB
rgb(250, 240, 230)HSL
hsl(30, 67%, 94%)HSV
hsv(30, 8%, 98%)CMYK approx.
cmyk(0, 4, 8, 2)Color value table
| Format | Value | Copy |
|---|---|---|
| HEX | #FAF0E6 | |
| RGB | rgb(250, 240, 230) | |
| HSL | hsl(30, 67%, 94%) | |
| HSV | hsv(30, 8%, 98%) | |
| CMYK approx. | cmyk(0, 4, 8, 2) | |
| CSS keyword | linen |
Contrast and classification
LightLightness1.12:1Contrast with white18.67:1Contrast with blackRed / OrangeColor family
Shade and tint preview
White 10%#FBF2E9
White 30%#FCF5EE
White 70%#FEFBF8
White 90%#FFFEFD
Black 10%#E1D8CF
Black 30%#AFA8A1
Black 70%#4B4845
Black 90%#191817
Harmony palettes
Complementary
#050F19#414950Analogous
#F9F0E8#FAEFE7Triadic
#F0E6FA#E6FAF0Split complementary
#323A42#040C15Using Linen
Linen 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-linen: #faf0e6;
}
.button-primary {
background: var(--color-linen);
color: #000000;
}
$linen: #faf0e6;
// Tailwind arbitrary value
class="bg-[#faf0e6] text-white"