

Please Note: Although the colour names above are supported by most major browsers, not all of them are actually valid HTML or CSS, as specified by W3C. You can sort the table by colour name or by hex code. color:DarkSlateBlue).Both HTML colour codes (hexadecimal values) and their CSS colour names are shown in the chart below. You could have, of course, represented this color by its color name (i.e. Therefore, the color "DarkSlateBlue" would be represented as color:#483D8B. In hexadecimal, ff is as high as you can go and 00 is as low (i.e. You could of course, use less red and more of the other colors, for example rgb(72,61,139) results in DarkSlateBlue.
#HTML CSS COLOR CODES HOW TO#
This article explains how to add images to your HTML code and how to then fine-tune them to look better. Modern browsers support a variety of image file types like. This is because 255 is as high as you can go in RGB notation. Adding images to the background of certain parts of a website is often more visually appealing and interesting than just changing the background-color. It's the same with hexadecimal notation, except, the notation uses base 16 to specify the red, green, and blue values.įor example, if you use RGB notation, rgb(255,0,0) specifies "all red and none of the other colors". This is because all colors are a mix of these three colors. Therefore, when using RGB notation, you are specifying how much red, how much green, and how much blue should be included in the final color. Here's an explanation of hexadecimal and RGB. After you select a color, you'll notice the RGB, HSL, and hexadecimal values are shown for your selected color. About Hexadecimal & RGB ColorsĬlick anywhere in the color picker to the right. Especially if you use a color picker like the one below. Hexadecimal and RGB will open your options right up. If you get stuck while trying to come up with a color scheme for your website, color names can be quite limiting. This is because, hexadecimal and RGB colors provide you with a far greater range of colors than color names. However, I recommend getting familiar with hexadecimal and RGB color values. After all, color names are easy to remember. It might be tempting to just stick to color names when specifying your HTML colors. For example, color:rgb(0,0,100%) results in red. For example, color:rgb(0,0,255) results in red. For example, color:#00f is the same as color:#0000ff Example, color:#0000ff results in a color of red. RGB value determined by hexadecimal notation.Color values can be one of the following: For example, to make something yellow, you type background-color:green.

But you can also over-ride these styles by using a 'span' element, like this and this.Īs you can see by the above HTML & CSS code, you specify a color by using the relevant CSS color property (eg, background-color), followed by a colon ( :), followed by the color value (eg, green). This text has got different styles applied. The surrounding 'div' element has got the following properties applied against it: background-color:yellow color:blue border:1px solid black The text within the element automatically inherits the colors that we specify at the level. For example, here we apply colors to the element. You can apply color to any element and it will cascade down to all elements within that element. To specify border color, use the border property, along with the border width and style: Source Code To specify background color, use the background-color property: Source Code To specify text color, you need to use color: is a color name, hex code, or decimal RGB value. Here are some examples of applying color to HTML elements. Let's look at a couple of simple examples first. Having said that, you should be aware of the various methods for specifying a color value, because, you may find that you prefer to use a combination of methods.īut let's not get ahead of ourselves. Most web developers choose their preferred method and stick with that. There are many ways of specifying color in HTML. When it comes to specifying an actual color, that's where things get a little interesting. For example, two popular CSS properties for defining color are the color property (for applying foreground color to the text) and background-color property (for applying color to an element's background). The property you use for a particular situation will depend on what it is you're applying color to. In HTML, color is defined using CSS properties.
