HTML Colors

What are HTML Colors?

HTML Colors are used to define the appearance of text, backgrounds, borders, or other elements on a web page. They can be specified in multiple ways, allowing developers to create visually appealing and accessible designs.

Methods to Define HTML Colors

Color Names
HTML supports 140 predefined color names like red, blue, green, etc.

Example:

<div style="color: red;">This text is red.</div>

Hexadecimal (Hex) Values
Represented as #RRGGBB (where RR, GG, BB are two-digit hexadecimal values for red, green, and blue).

Example:

<div style="color: #ff0000;">This text is red using Hex code.</div>

RGB (Red, Green, Blue)
Defined using rgb(red, green, blue) with values from 0 to 255.

Example:

<div style="color: rgb(255,0,0);">This text is red using RGB.</div>

RGBA (RGB + Alpha)
Adds transparency (alpha channel) to RGB with values ranging from 0 (completely transparent) to 1 (fully opaque).

Example:

<div style="color: rgba(255,0,0,0.5);">This text is semi-transparent red.</div>

HSL (Hue, Saturation, Lightness)
Defined using hsl(hue, saturation%, lightness%). Hue ranges from 0 to 360°, and percentages are used for saturation and lightness.

Example:

<div style="color: hsl(0, 100%, 50%);">This text is red using HSL.</div>

 

Summary

HTML Colors allow developers to style web pages creatively. They can be defined using predefined names, hex codes, RGB, RGBA, or HSL values.