Webpages are designed to be displayed on a screen and therefore use RGB format. Colors can be expressed in different ways in HTML, however the HEX RGB notation is the correct method.
In this post:
- Word! HTML color names
- HEX value colors
- Color pickers
- HTML 5
1. Word! HTML color names
HTML provides a long list of color names in the form of words. The names of most common colors occur in the list and you are safe with: black, white, red, blue, green, yellow, magenta, gray, etc. Some of these color names appear on the NSC HTML Tag sheet.
There are many more exotic colors such as chartreuse, tomato, darksalmon & teal.
For the complete set of color names, visit https://www.w3schools.com/colors/colors_names.asp
2. HEX value colors
The correct way to express color in a webpage is by using HEX values. This is a notation for expressing a mix of red, green and blue. HEX notation always starts with a # (hashtag) followed by 6 characters. The first 2 characters represent red, the second 2 green and the third 2 blue.
For example, if you want to mix a pure red, you will take the full amount of red with no green and no blue: #FF0000
3. Color pickers
There are a multitude of online color pickers that allow you to select a color visually and then give you the HEX color values — start here: https://www.w3schools.com/colors/colors_picker.asp
Of course, you may have a color in a picture or a logo and you would like to reproduce that color in your webpage as a HEX value. Most image editing software includes an “eyedropper” feature which allows you to click on a color to select that color for editing. Microsoft PowerPoint has this feature. This allows you to select a color and have the RGB color HEX made visible.
You may even want to include a color picker in your webpage. HTML5 introduced the color
value for the
type attribute for the
input tag to allow for just that!