There are 16,777,216 different HTML color combinations.
I could go into great depth and detail about where they come from and how they were derived… But I’m not going to.
I’m going to give you some of the basics so you don’t sound like a moron when you’re speaking about HTML colors. And you’ll be able to create your own colors too.
The first thing you have to do is change your mindset.
Colors on computer monitors and televisions are called “additive” colors. When you combine red, green and blue together, they will appear white. When you take all colors away, you get black.
The antonym to “additive” colors are “subtractive” colors… This would be like crayons or paint… All colors combined create black and the subtraction of all colors creates white.
HTML colors are often written as hexadecimal numbers.
Hexadecimal numbers use 16 symbols to represent numbers.
- 0-9 are equal to values 0-9.
- A-F represent the values 10-15.
0 is the lowest value equaling “no color added”
F is the highest value equaling “all color added”
Low 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E, F High
Colors are specified by a hash tag (#) followed by a 6 digit hexadecimal number
Each 6 digit code is made up of 3 pairs of colors… Red, Green and Blue.
- #000000 = Black… Absence of all colors
- #FF0000 = Red
- #00FF00 = Green
- #0000FF = Blue
- #FFFFFF = White… Combination of all colors
Internet Safe Colors
Unless someone is using a dinosaur of a computer, every color is safe for use on the Internet… So don’t worry if it’s an Internet safe color or not.
The chart below has 40 commonly used HTML color codes.
If you can’t find the HTML Color you are looking for, either create your own or search Google for “HTML Color Charts”…
Black | #000000 | |
Dark Grey | #424242 | |
Medium Grey | #6e6e6e | |
Lighter Grey | #a4a4a4 | |
Light Grey | #d3d3d3 | |
White | #ffffff | |
Burgundy | #800000 | |
Red | #ff0000 | |
Magenta | #ff00ff | |
Light Pink | #faafbe | |
Brown | #804000 | |
Red-Orange | #ff3300 | |
Orange | #ff6600 | |
Light Orange | #ff9912 | |
Tan | #eed6af | |
Gold | #ffd700 | |
Yellow | #ffff00 | |
Light Yellow | #ffff66 | |
Dark Green | #006600 | |
Olive Green | #808000 | |
Green | #00ff00 | |
Sea Green | #8fbc8f | |
Bright Green | #33ff00 | |
Lime Green | #32cd32 | |
Light Green | #a9f5a9 | |
Dark Teal | #ob615e | |
Teal | #088a85 | |
Turquoise | #7fffd4 | |
Aqua | #00ffff | |
Light Turquoise | #afeeee | |
Navy Blue | #000080 | |
Blue | #0000ff | |
Light Blue | #1e90ff | |
Sky Blue | #00bfff | |
Pale Blue | #87cefa | |
Blue-Grey | #0b3861 | |
Indigo | #08088a | |
Purple | #800080 | |
Plum | #b93b8f | |
Lavender | #e3e4fa |
P.S.
If HTML is confusing to you… You might want to read an introduction to HTML and basic HTML codes.