CSS Color

CSS Colors

Color property is used to set the color of the text.

Syntax: {color: value;}

Now there are many ways of giving this value to the colour. Some of the most common are listed below.

CSS Background Color

<h1 style="background-color: lightblue;">Hello World</h1>

Output

CSS Text Color:

·      We can set the text color

<h2 style="color: blueviolet;">Hello World</h2>

output:

1. RGB format

·      The full form of RGB is “Red, Green, Blue” and thus it defines the colour value by taking three arguments ranging from 0 to 255.

Syntax: {color: rgb(0,0,0);}.

·      Note that this color is black, if you change each of the values to 255 white colours of the text would be selected.

.color {

    /* color with name */

    color: red;

    /* color with  RGB color value represents RED, GREEN, and BLUE.

    And rgb value can be from 0 to 255 */

    color: rgb(14, 12, 184);

    /* color with Hex */

    color: #b9005c;

}

2. Hexadecimal notation:

By using the hex code of any color you can assign 

3. HSL

•    HSL stands for Hue, Saturation, and Lightness. Tweaking these values gives different colors, and the syntax is quite similar to RGB
•      HSL(hue, saturation, lightness)
•       Hue is a degree on the color wheel from 0 to 360. 0 is red, 120 is green, and 240 is blue.
•       Saturation is a percentage value. 0% means a shade of gray, and 100% is the full color.
•       Lightness is also a percentage. 0% is black, 50% is neither light nor dark, and 100% is white