HTML and CSS Reference
In-Depth Information
RGB (actually available since CSS2) works in a similar way to hex values. You define
red, green, and blue channels, but you do it using numbers between 0 and 255, not
pairs of hexadecimal numbers:
rgb(255,0,0) .
Equivalent to #ff0000 or red
rgb(255,255,255) .
Equivalent to #ffffff or white
RGBA takes this a step further, adding a fourth value that specifies the alpha
channel, or the opacity of the color. This value is between 0 and 1; 0 is completely
transparent, and 1 is completely opaque:
rgba(255,0,0,1) .
Full red with full opacity
rgba(255,0,0,0.5) .
ll d t 0 t t t
rgba(255,0,0,0.2) .
ll d t 0 t t t
HSL—hue, saturation, and lightness—is a different way of defining a color, which
makes a lot of sense to many people, especially designers who are used to using
graphics editors. The syntax looks like this:
hsl(0,100%,50%) .
Equivalent to #ff0000 or red
hsl(0,0%,100%) .
i l t to #ffffff or white
The first value—hue—takes a value between 0 and 360. It's basically a point
around a standard color wheel circle.
The second value—saturation—takes a value of 0-100% and refers to how
bright the color is; 100% is full color, and 0% is greyscale.
The third value—lightness—takes a value of 0-100% and refers to how light
the color is; 100% is completely light/white, and 0% is completely dark/black.
Search WWH ::

Custom Search