Using colors in the CSS scripts.

The Cascading Style Sheets, the CSS,  is a programming language that allows you to handle the styles of the HTML elements. In other words, this programming language inherits the attributes of the HTML tags and can assign them the respective values without the need of typing each attribute and each value inside the respective tag. In this context, working with colors in the CSS codes responds to several factors. Some factors are related to the HTML elements, some other elements are related to the displaying tool. the following lines are intended to describe how to use colors in the CSS scripting.

HTML tags and colors:

The color property is an attribute within several HTML tags. In fact, all the elements that can have different colors are susceptible to receiving the color attribute and of course display the assigned values. The most famous tag that involves the color attributes is the font tag.

Nowadays, with the updates, the color can be assigned to an attribute of the HTML tag. The background color, the border color, and the underline color are the common attributes associated with the color property.

Declaring colors in CSS scripting:

The common way to assign colors is to create a style to associate with the desired element. This way, the style script will handle assigning the color as a sub-attribute to the desired element. There are three ways to declare the color property.

  • The text form: this form uses the name of the color as value. For example, to assign the red color or the blue color, we type

Color: red;


Color: blue;

  • The hexadecimal form: this form uses the hexadecimal code of the color. There is a complete list of the codes of the colors. For convenience, the editors usually use a color selector that helps to pick the suitable color and turn it into an hexadecimal code.

Color:  #FF0000; (red)

Color:  #0000FF; (blue)

  • The RGB form: it describes the system of color with primary colors Red, Green, Blue.

Color:  RGB(255,0,0); (red)

Color:  RGB(0,0,255); (blue)

Actually, these are the three basic representation of the color property within the CSS script. They are the basic HTML codes. However, the two last forms seem to offer more option regarding the colors since they allow to code for the custom colors. The first form is definitely the most restricted form because it doesn’t allow the user to set the accurate value of colors.

Tips for working with colors:

When it is about working with colors, such creating transitions of colors in response to particular events, it is better to code in hexadecimal. In fact, the browsers support the hexadecimal and the rgb forms, but may interpret the color differently when it is set as text.

To transform RGB code into hexadecimal, or vice versa, it is important to notice that the “FF” is intended to say “255”. The RGB(255,255,255) corresponds to #FFFFFF (white).the RGB (0,0,0) is equal to #000000 which will display black.


This been said, the most important thing to consider when setting the color system is the device resolution and the color specter. Indeed, as you may have noticed, red is not the same red all over devices. No idea which color to choose? Consult a freelance web designer Singapore today.