HTML Colors

There are three ways of how you can change the color of the text in HTML: using Hex color codes, HTML color names or RGB values.

Hex Color Codes

A hex color code is a hex triplet, which represents three separate values specifying the levels of the component colors. It is defined using a hexadecimal (hex) notation for the combination of Red, Green, and Blue color values (RGB). The lowest value that can be given to one of the light sources is 0 (hex 00). The highest value is 255 (hex FF).

Hex values are written as 6 digit numbers, starting with a # sign. Letters used in a hexadecimal digit may be uppercase or lowercase. For example, to specify white color you can write #FFFFFF or #ffffff.

To add a color to the text element you should use style attribute, where color property is your Hex code, or corresponding CSS properties.

Example

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
    <style>
      div {
        background-color: #1c87c9;
        color: #d5dce8;
        padding: 22px;
      }
    </style>
  </head>
  <body>
    <div>
      <p>This is a text in grey, and the background is blue</p>
    </div>
    <p style="color:#8ebf42;"> This is a text in green</p>
  </body>
</html>

Result

In the table below you can see the Hex values of web colors. You can also use our Color Picker tool to browse millions of colors with Hex color codes.

HTML Color Names

To color the text element using an HTML color name, put the name of the color (blue, for ex.) instead of Hex code from the previous step.

Example

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
    <style>    
      div {
        background-color: blue;
        color: #d5dce8;
        padding: 22px;
      }
    </style>
  </head>
  <body>
    <div>
      <p>This is a text in grey, and the background is blue</p>
    </div>
    <p style="color:blue;"> This is a text in blue</p>
  </body>
</html>

Result

RGB Color Values

To add a color to the text element you should use style attribute, where color property is your RGB value, or corresponding CSS properties.

Example

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
    <style>
      div {
        background-color:rgb(25,25,112);
        color: rgb(169,169,169);
        padding: 22px;
      }
    </style>
  </head>
  <body>
    <div>
      <p>This is a text in grey, and the background is blue</p>
    </div>
    <p style="color:rgb(25,25,112);"> This is a text in blue</p>
  </body>
</html>

Result

Here is 216 cross-browser color palette used for creating pages of websites.

Hex Value Color RGB Value
#000000 rgb(0,0,0)
#FFFFFF rgb(255,255,255)
#FF0000 rgb(255,0,0)
#00FFFF rgb(0,255,255)
#0000FF rgb(0,0,255)
#C0C0C0 rgb(192,192,192)
#FF00FF rgb(255,0,255)

Hex Value Color RGB Value
#000000   rgb(0,0,0)
#080000   rgb(8,0,0)
#100000   rgb(16,0,0)
#180000   rgb(24,0,0)
#200000   rgb(32,0,0)
#280000   rgb(40,0,0)
#300000   rgb(48,0,0)
#380000   rgb(56,0,0)
#400000   rgb(64,0,0)
#480000   rgb(72,0,0)
#500000   rgb(80,0,0)
#580000   rgb(88,0,0)
#600000   rgb(96,0,0)
#680000   rgb(104,0,0)
#700000   rgb(112,0,0)
#780000   rgb(120,0,0)
#800000   rgb(128,0,0)
#880000   rgb(136,0,0)
#900000   rgb(144,0,0)
#980000   rgb(152,0,0)
#A00000   rgb(160,0,0)
#A80000   rgb(168,0,0)
#B00000   rgb(176,0,0)
#B80000   rgb(184,0,0)
#C00000   rgb(192,0,0)
#C80000   rgb(200,0,0)
#D00000   rgb(208,0,0)
#D80000   rgb(216,0,0)
#E00000   rgb(224,0,0)
#E80000   rgb(232,0,0)
#F00000   rgb(240,0,0)
#F80000   rgb(248,0,0)
#FF0000   rgb(255,0,0)

Hex Value Color RGB Value
#000000   rgb(0,0,0)
#080808   rgb(8,8,8)
#101010   rgb(16,16,16)
#181818   rgb(24,24,24)
#202020   rgb(32,32,32)
#282828   rgb(40,40,40)
#303030   rgb(48,48,48)
#383838   rgb(56,56,56)
#404040   rgb(64,64,64)
#484848   rgb(72,72,72)
#505050   rgb(80,80,80)
#585858   rgb(88,88,88)
#606060   rgb(96,96,96)
#686868   rgb(104,104,104)
#707070   rgb(112,112,112)
#787878&   rgb(120,120,120)
#808080   rgb(128,128,128)
#888888   rgb(136,136,136)
#909090    rgb(144,144,144) 
#989898   rgb(152,152,152)
#A0A0A0    rgb(160,160,160) 
#A8A8A8   rgb(168,168,168)
#B0B0B0   rgb(176,176,176)
#B8B8B8   rgb(184,184,184)
#C0C0C0   rgb(192,192,192)
#C8C8C8   rgb(200,200,200)
#D0D0D0   rgb(208,208,208)
#D8D8D8   rgb(216,216,216)
#E0E0E0   rgb(224,224,224)
#E8E8E8   rgb(232,232,232)
#F0F0F0   rgb(240,240,240)
#F8F8F8   rgb(248,248,248)
#FFFFFF   rgb(255,255,255)

Web-color
#000000 #000033 #000066 #000099 #0000CC #0000FF
#003300 #003333 #003366 #003399 #0033CC #0033FF
#006600 #006633 #006666 #006699 #0066CC #0066FF
#009900 #009933 #009966 #009999 #0099CC #0099FF
#00CC00 #00CC33 #00CC66 #00CC99 #00CCCC #00CCFF
#00FF00 #00FF33 #00FF66 #00FF99 #00FFCC #00FFFF
#330000 #330033 #330066 #330099 #3300CC #3300FF
#333300 #333333 #333366 #333399 #3333CC #3333FF
#336600 #336633 #336666 #336699 #3366CC #3366FF
#339900 #339933 #339966 #339999 #3399CC #3399FF
#33CC00 #33CC33 #33CC66 #33CC99 #33CCCC #33CCFF
#33FF00 #33FF33 #33FF66 #33FF99 #33FFCC #33FFFF
#660000 #660033 #660066 #660099 #6600CC #6600FF
#663300 #663333 #663366 #663399 #6633CC #6633FF
#666600 #666633 #666666 #666699 #6666CC #6666FF
#669900 #669933 #669966 #669999 #6699CC #6699FF
#66CC00 #66CC33 #66CC66 #66CC99 #66CCCC #66CCFF
#66FF00 #66FF33 #66FF66 #66FF99 #66FFCC #66FFFF
#990000 #990033 #990066 #990099 #9900CC #9900FF
#993300 #993333 #993366 #993399 #9933CC #9933FF
#996600 #996633 #996666 #996699 #9966CC #9966FF
#999900 #999933 #999966 #999999 #9999CC #9999FF
#99CC00 #99CC33 v99CC66 #99CC99 #99CCCC #99CCFF
#99FF00 #99FF33 #99FF66 v99FF99 #99FFCC #99FFFF
#CC0000 #CC0033 #CC0066 #CC0099 #CC00CC #CC00FF
#CC3300 #CC3333 #CC3366 #CC3399 #CC33CC #CC33FF
#CC6600 #CC6633 #CC6666 #CC6699 #CC66CC #CC66FF
#CC9900 #CC9933 #CC9966 #CC9999 #CC99CC #CC99FF
#CCCC00 #CCCC33 #CCCC66 #CCCC99 #CCCCCC #CCCCFF
#CCFF00 #CCFF33 #CCFF66 #CCFF99 #CCFFCC #CCFFFF
#FF0000 #FF0033 #FF0066 #FF0099 #FF00CC #FF00FF
#FF3300 #FF3333 #FF3366 #FF3399 #FF33CC #FF33FF
#FF6600 #FF6633 #FF6666 #FF6699 #FF66CC #FF66FF
#FF9900 #FF9933 #FF9966 #FF9999 #FF99CC #FF99FF
#FFCC00 #FFCC33 #FFCC66 #FFCC99 #FFCCCC #FFCCFF
#FFFF00 #FFFF33 #FFFF66 #FFFF99 #FFFFCC #FFFFFF