![3 letter css color codes 3 letter css color codes](https://s3.amazonaws.com/nettuts/716_colorCodes/chart.jpg)
The first two characters specify the red value ( b5 in the example), the second two specify green ( 12), and the last two blue ( 3b). In older versions of HTML, colours could only be specified with six characters, like #b5123b.
![3 letter css color codes 3 letter css color codes](https://media.geeksforgeeks.org/wp-content/uploads/20191109104705/sdsds.png)
You may also want to experiment with the Interactive Colour Mixer provided as extra content in this Guide, or a video using the colour mixer and talking about additive colours.
3 letter css color codes code#
If you understand the 0 to f scale, and how the red, green, and blue values go together to make a colour, you should be able to come up with a colour code fairly quickly. You shouldn't have to memorize these colour codes.
![3 letter css color codes 3 letter css color codes](https://i.stack.imgur.com/OgwHo.png)
But armed with this fact, we can guess that a lighter yellow might be #ffa: like yellow but closer to white. Some colours we can guess from previous examplesīecause the additive and subtractive colour models don't work the same way, there's one colour in particular that you might not guess: #ff0 is yellow. More blue than the others, closer to white You should by now be able to guess these: Code If you know a few basic ideas, you can guess what colour a particular code is, or what code you should write for a colour. The point of these examples is not that drawing colour scales is fun, but that there is a certain logic to these colour codes. If we keep experimenting, we can try a scale of colours from red ( #f00) to white ( #fff) like this: Colour scale from #000 to #fffĪgain maybe not suprpisingly, we see that between red and white are shades of pink. When the three components are the same, none is brighter than the other and we end up with a shade of grey with black ( #000) and white ( #fff) at the extremes. What happens if you turn up all three (red, green, blue) values together? Colour scale from #000 to #fff This should be be fairly predictable: it starts black and as you add red, it gets redder. This is the result if we increase the amount of red from 0 (none) to f (lots): Colour scale from #000 to #f00 If we start increasing the first character, we add red to the colour. For example, the colour #f70 indicates a lot of red, a medium amount of green, and no blue (or #F70: case doesn't matter in these colour codes).īased on this, we can guess that #000 is very dark: it is the colour code for black. The three primary colours are specified in the order red, green, blue, prefixed with a #. The f end is a lot of the colour (bright/on). The 0 end of the scale is little of the colour (dark/off). The amount of each primary colour is specified with a character on this scale: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, a, b, c, d, e, f We will use the three-character method of specifying a CSS colour. To mix light to produce a colour on the screen, we will have to mix various amounts of red, green, and blue to get the desired result. Additive colour is also called the RGB colour model. The primary colours in the additive colour model are red, green, and blue. Computer screens start black, and light is added to produce a colour, using the additive colour model. However, paints and computer screens create colours differently. Since the paint removes parts of the reflected light, this is also referred to as the subtractive colour model. With paint, the coloured surface absorbs parts of the (usually white) light that illuminates it. Paints and dyes are mixed with the primary colours cyan (blue), yellow, and magenta (red) in the CYM colour model. If you've ever mixed colours together, you've probably done it with paint.
![3 letter css color codes 3 letter css color codes](https://www.computerhope.com/cdn/color-code.png)
Does this look white to you?, Physics Girl video on how colours work. About Coloursīefore we start giving numeric colour values, you should know at least a little about how colour works. There are some built-in words in CSS that can be used to specify a colour, like red and lavender, but they are quite limiting since you're restricted to the colours that happen to have been assigned words. We have seen a few places where we need to speficy a colour in CSS: the text colour and background colour for content ( color and background-color), the colour of a border ( border-color or in the border shorthand property).