In this article, we will learn about colors in CSS. There are various ways in which we can color the elements in an HTML document using CSS.

Ways in which we can color elements:

• Using color name
• Using rgb color
• Using Hex color

---

• Using color name: We can add color to any element just by writing the color name in the color attribute of element in the style sheet.

Example:

p {
   color:red;
   }

Output:

• Using rgb color: We can add colors to elements using rgb(red, green, blue).

In this rgb is abbreviated for red, green, and blue and we can give intensities to each parameter whose values vary between 0 and 255.

So if we want to give red color to an element we can write as rgb(255, 0, 0), and the same follows for green and blue as rgb(0, 255, 0) and rgb(0, 0, 255), respectively.

If we want to set the color as black, set the intensity of each element as 0: rgb(0, 0, 0).

and If we want to set the color as white, set the intensity of each element as 255: rgb(255, 255, 255).

Example:

#para1 {
        color: rgb(255, 0, 255);
        }

#para2 {
        color: rgb(255, 255, 0);
        }

#para3 {
        color: rgb(0, 255, 255);
        }

Output:

• Using Hex color: In this method, We can color our HTML element using hexadecimal(16-digit) code, #RRGGBB where RR represents Red, GG represents Green, and BB represents Blue.

The value of each color varies between 00 and ff(which is 255).

So, if we want to display red color , we can write #ff0000 which sets the value of RR to its maximum value and hides GG and BB color as they have minimum values.

Example:

#para1 {
        color: #ff0000;
        }

#para2 {
        color: #00ff00;
        }

#para3 {
        color: #0000ff;
        }

Output:

Hope this article will guide you to recognize all about the Colors in CSS that you needed and still if you have any problem or queries regarding this, post them in the comments section and we will be glad to assist you.