Web Safe Color
Copy-ready color values
HEX
#CCCC99RGB
rgb(204, 204, 153)HSL
hsl(60, 33%, 70%)HSV
hsv(60, 25%, 80%)CMYK approx.
cmyk(0, 0, 25, 20)Color value table
| Format | Value | Copy |
|---|---|---|
| HEX | #CCCC99 | |
| RGB | rgb(204, 204, 153) | |
| HSL | hsl(60, 33%, 70%) | |
| HSV | hsv(60, 25%, 80%) | |
| CMYK approx. | cmyk(0, 0, 25, 20) | |
| CSS keyword | cccc99 |
Contrast and classification
LightLightness1.66:1Contrast with white12.66:1Contrast with blackRed / OrangeColor family
Shade and tint preview
White 10%#D1D1A3
White 30%#DBDBB8
White 70%#F0F0E0
White 90%#FAFAF5
Black 10%#B8B88A
Black 30%#8F8F6B
Black 70%#3D3D2E
Black 90%#14140F
Harmony palettes
Complementary
#333366#64648BAnalogous
#CCCC9F#CCC69FTriadic
#CC99CC#99CCCCSplit complementary
#585882#2A2A54Using Cccc99
Cccc99 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-cccc99: #cccc99;
}
.button-primary {
background: var(--color-cccc99);
color: #000000;
}
$cccc99: #cccc99;
// Tailwind arbitrary value
class="bg-[#cccc99] text-white"