CSS Colors

Color in CSS

Many times, we need to give some colors to some elements, like while changing the color of some text, or some background color, or while specifying the color of shadow, etc.

So, we can do it in some different ways as well. One standard way that we have been practicing, is just using a standard color name, like black, blue, white, red, pink, etc. There are 140 standard color names supported in CSS. Let’s

have an example for this way(you know though, but still) –

well, if you try to follow along, and open this file in the browser, you can see that the paragraph text is there in red color. Have a look at the output –

If not the names of the colors, you can use the other ways as well, like putting the hex code of the corresponding color. You don’t have to remember the hex code of every color, but you can remember some really simple and useful color codes, like #000000 is for black, and the #ffffff is for white.

In the above example, we have chosen red color for the paragraph text. The hex code for the red color is #ff0000. Have a look at the same code from above, but this time, we are just using the hex code instead of the color name. Basically, with hex codes, we can represent over 16 million colors.

If you try to make that change in the previously discussed code, you can again find that paragraph in red color.

Yet, we have another way, through which, we can set the color. We can do it through the RGB values. The RGB means Red, Green, and blue. Here, we are going to set the parameters like the red value, green value, and blue value. So, it is like RGB(red, green, blue). Each parameter we have here does define the intensity of the respective colors.

So, if we define something like this – RGB(255, 0, 0), this means that the color now would be red, since red has complete intensity, and others have zero intensity. Doing RGB(0, 0, 0) means that the color would be black. Let’s have a look at the code below for implementation of the same –

If you have a look at the output, you can see that the color of the text in the paragraph changes. So, you can use different ways to add colors. Wherever you need to add some color, like in the background color as well, or wherever you need to specify some color, you can use those different ways, like using the name of the color, or using the hex code of the color, or using the RGB values for the color, etc.