CSS TutorialLesson 7Free preview

CSS Colors

This lesson is part of CSS · All levels

Summary

CSS supports several ways of specifying colors: color names (red), hex values (#ff6600), RGB (rgb(255, 102, 0)), HSL (hsl(24, 100%, 50%)), as well as transparent keywords. Color can be applied to text, background, border, and many other properties. The choice of color representation determines how easily the color can be adjusted later.

Key points

Colors can be expressed by names, hex (#rrggbb), RGB/RGBA, HSL/HSLA, or keywords such as transparent.
Hex consists of six hexadecimal digits; three digits such as #f90 is short for #ff9900.
The RGB format uses the 0-255 component; RGBA adds an alpha 0-1 channel for transparency.
HSL makes it easy to set hue (0-360), saturation, and lightness to create color variations.
The color property governs the text color, while the background-color governs the element background color.

Full lesson

Code examples and quizzes

Full lessons, code examples, and quizzes are available to subscribers. 5 questions.