Bert Bos | CSS tutorial – colors
Colors
Colors are used for text, borders, color gradients, and soon also for underlining.
Name | Hex | RGB | HSL | |
---|---|---|---|---|
aquamarine | #7FFFD4 | rgb(127,255,212) | hsl(160,100%,75%) | |
- | #DC9074 | rgb(220,144,116) | hsl(16,50%,66%) | |
coral | #FF7F50 | rgb(255,127,80) | hsl(16,100%,66%) | |
- | #b73000 | rgb(184,49,0) | hsl(16,100%,36%) | |
darkorchid | #9932CC | rgb(153,50,204) | hsl(280,61%,50%) | |
black | #000 | rgb(0,0,0) | hsl(0,0,0) | |
gold | #FFD700 | rgb(255,215,0) | hsl(51,100%,50%) |
rgba(R,G,B,alpha) and hsla(H,S,L,alpha)
hsla(20, 90%, 50%, 0.0)
hsla(20, 90%, 50%, 0.3)
hsla(20, 90%, 50%, 0.6)
hsla(20, 90%, 50%, 1.0)
'opacity' makes the whole element transparent
P {opacity: 0.8}
← almost
transparent
Transparancy is only one of the ways to combine foreground and background.
Two new modules with advanced graphical operations are in development:
Make a document with a number of elements whose colors only differ in hue
This can pose a problem for people with color blindness or less than perfect eyseight. What can you do about that?