Buzz
Color (color) in CSS is utilized to set colors for elements of an element or to serve as background colors, among other purposes. Continue reading this article by Mytour to deepen your understanding of CSS and color usage.
Colors in CSS: Background, Transparency, Text
The Ultimate CSS Color Codes
CSS employs color values to specify displayed colors. Typically, these colors are utilized to set the color for elements of an element (such as text, ...) or used to create background colors, border colors, and more.
We can specify various color values. The table below lists all the color formats in CSS:
Format Syntax Example
Hex Code Format #RRGGBB p{color:#FF0000;}
Short Hex Code Format #RGB p{color:#6A7;}
RGB Percentage Format rgb(rrr%,ggg%,bbb%) p{color:rgb(50%,50%,50%);}
RGB Color Model rgb(rrr,ggg,bbb) p{color:rgb(0,0,255);}
Color names like aqua, black, ... p{color:teal;}
Hex Code Format in CSS
Hex (hexadecimal) is an abbreviation of Hexadecimal. Simply put, a Hex value consists of 6 characters representing a color value. Where the first 2 characters (RR) represent the Red value, the next 2 characters (GG) represent Green, and the last 2 characters (BB) represent Blue.
Hex values can be obtained from any graphics software such as Adobe Photoshop, Jasc Paintshop Pro, or even Advanced Paint Brush.
The symbol '#' precedes each Hex Code value.
Short Hex Code Format in CSS
Short Hex Code is the condensed form of Hex Code. In this format, pairs of digits are condensed into a corresponding single digit. For example, the value #66AA77 is equivalent to #6A7 in Short Hex Code.
Hex values can be obtained from any graphic software such as Adobe Photoshop, Jasc Paintshop Pro, or even Advanced Paint Brush.
The symbol '#' precedes each Hex Code value.
RGB Value in CSS
Color values are specified using the rgb() attribute. This attribute takes 3 values, one for RED, one for Green, and one for Blue. Values can be integers from 0 to 255 or in percentage form (%).
Note: Not all browsers support the rgb() attribute. Therefore, Mytour recommends not using this attribute.
Create Color Codes
Using the HTML Color Code Builder, we can generate millions of different color codes. However, to use this tool, we will need to enable Java in the browser.
List of Browser-Safe Colors
The table below includes a list of 216 different color codes deemed 'safe' for web browsers and ensure accurate display on computers.
In the above article, Mytour just introduced you to color codes in CSS. In the next CSS lesson, Mytour will further introduce you to The background property in CSS.
Furthermore, if you have any doubts or questions needing clarification, readers can leave their comments below the article.
