CSS COLORS
HTML Colors can be specified using the pre-defined color names, or using RGB, RGBA or HEX values.
Let's see how we can specify the colors using color names.
Color Name
Let's have a look at few colors:
Orange
OrangeRed
DodgerBlue
Gold
DarkKhaki
MediumPurple
DarkViolet
SlateBlue
Chartreuse
HotPink
Yellow
LightCoral
CSS Text Colors
Text color can be changed using the CSS color property. Here's an example:
<p style="color:red">This statement is Red</p>
<p style="color:green">Why Green?</p>
Output:
This statement is Red
Why Green?
CSS Border Colors
Bordor colors can be defined using the CSS border-color property or the shorthand approach. Here's an example:
<h2 style="border:2px solid red">Border will be Red</h2>
<h2 style="border:2px solid pink">We will get a pink border now</h2>
<h2 style="border:2px solid purple">We will get a purple border now</h2>
Output:
Border will be Red
We will get a pink border now
We will get a purple border now
Color Values (RGB, RGBA, HSL, HEX, HSLA)
RGB, RGBA, HEX, HSL values can also be used to specify colors. Let's see how we can do that:
Color Name
Magenta
Orange
HEX Code
#FF00FF
#FFA500
RGB Code
rgb(255, 0, 255)
rgb(255, 165, 0)
Let's check an example on how we can use these colors:
<p style="color:darkred; background-color:pink;">Defining Color using Color Name</p>
<p style="color:#CD5C5C; background-color:#FFA07A;">Defining Color using Hex Color Code</p>
<p style="color:rgb(29, 131, 72); background-color:rgb(130, 224, 170 );">Defining Color using RGB Color Code</p>
<p style="background-color:rgba(255, 215, 0, 0.5);">Defining Color using RGBA Color Code</p>
Output:
Defining Color using Color Name
Defining Color using Hex Color Code
Defining Color using RGB Color Code
Defining Color using RGBA Color Code
Here's the list of some more colors: