Working with Colors

Colors in CSS can be specified using predefined color names, RGB, HEX, HSL, RGBA, or HSLA values.

CSS supports 140 standard color names.

/* Color Names */
h1 { color: red; }

/* HEX Values */
h2 { color: #ff0000; }

/* RGB Values */
h3 { color: rgb(255, 0, 0); }

/* RGBA (with transparency) */
p { color: rgba(255, 0, 0, 0.5); }

/* HSL Values */
div { background-color: hsl(0, 100%, 50%); }

• Color names - red, blue, green, etc.
• HEX - #RRGGBB format (#ff0000)
• RGB - rgb(red, green, blue)
• RGBA - RGB with alpha (transparency)
• HSL - hsl(hue, saturation, lightness)

<h1>Red Heading</h1>
<p class="hex">HEX Color</p>
<p class="rgb">RGB Color</p>
<p class="rgba">RGBA with Transparency</p>