CSS Named Color
Copy-ready color values
HEX
#A0522DRGB
rgb(160, 82, 45)HSL
hsl(19, 56%, 40%)HSV
hsv(19, 72%, 63%)CMYK approx.
cmyk(0, 49, 72, 37)Color value table
| Format | Value | Copy |
|---|---|---|
| HEX | #A0522D | |
| RGB | rgb(160, 82, 45) | |
| HSL | hsl(19, 56%, 40%) | |
| HSV | hsv(19, 72%, 63%) | |
| CMYK approx. | cmyk(0, 49, 72, 37) | |
| CSS keyword | sienna |
Contrast and classification
DarkLightness5.62:1Contrast with white3.74:1Contrast with blackRed / OrangeColor family
Shade and tint preview
White 10%#AA6342
White 30%#BD866C
White 70%#E3CBC0
White 90%#F6EEEA
Black 10%#904A29
Black 30%#703920
Black 70%#30190E
Black 90%#100805
Harmony palettes
Complementary
#5FADD2#85C1DDAnalogous
#97523B#A04E31Triadic
#522DA0#2DA052Split complementary
#7CBCDA#4E8EACUsing Sienna
Sienna 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-sienna: #a0522d;
}
.button-primary {
background: var(--color-sienna);
color: #ffffff;
}
$sienna: #a0522d;
// Tailwind arbitrary value
class="bg-[#a0522d] text-white"