Looking to start working on your website? Maybe, you are looking to add a flair of colour to the bland black and white terminals.
Colours are of immense importance when we are talking about giving the perfect look and feel to your website. You can specify colours on page level using <body> tag or you can set colours for individual tags using bgcolor attribute. The <body> tag has the following attributes which can be used to set different colours −
There are following three different methods to set colours in your web page −
You can indicate directly the name of the shade that you want to set content or background tone. 16 fundamental named colours can be used in HTML. There are more than 200 distinctive shading names that most of the browsers support.
Colour-code is the way how the computer infers and renders a specific shade. Used heavily in sites and other programming applications, there is no shortage of method using which you specify the colours. The RGB, HSV, HSL, and CMYK are some of the most widely used standards.
A hexadecimal colour code is generally a 6 digit representation of the colour. The first two digits stands for the Red channel, the next two are for the Green channel, and the last two are for the Blue channel. Most of the graphical software like an image or video processing software makes heavy use of them. So you can easily find the actual RGB values of a specific shade.
The hex code generally starts with a hash/pound symbol (‘#’). The hash is followed by 6 values taking values between 0-9 and A-F. The hexadecimal value of a single channel can range from 00 (zero in decimal) to FF (255 in decimal).
The colour white, for example, is made by mixing each of the three primary colours at their full intensity, resulting in the Hex colour code of #FFFFFF. Black, on the other hand, signifies the absence of any colours. So it is expressed as #000000 in the hexadecimal colour code.
All the other colours are simply a combination of these three values. When only one of the channels have the highest possible intensity while the others are absolutely zero, we get the primary colours (red, green, and blue).
With modern browsers supporting the full spectrum of 24-bit colour, there are 16,777,216 different colour possibilities. Use our colour picker to explore all 16.7 million of them, or if that’s too many, check out our colour charts for a selection of palettes focused on flat design, Material design and web-safe colours.
HSL (Hue, Saturation, Lightness) and HSV (Hue, Saturation, Value) are alternative colour schemes of the RGB representation. These models were popularised back in 1970 by the researchers. The HSV colour space though was invented by Georges Valensi almost three decades earlier in 1938. This scheme of representing the colours models more closely how we, humans, actually see and perceive colours.
In these models, colours of each hue are arranged in a radial slice, around a central axis of neutral colours which ranges from black at the bottom to white at the top. The HSV scheme tries to emulate how we mix paints of various colours to come up with a new one. The saturation works like the tints of brightly coloured paints, while the values resemble the mixture of those paints with varying amounts of black or white paint
The HSL model attempts to resemble more perceptual colour models such as the Natural Color System, placing fully saturated colours around a circle at a lightness value of 1⁄2, where a lightness value of 0 or 1 is fully black or white, respectively.
The CMYK (Cyan, Magenta, Yellow, and Key/Black) colour scheme is an example of what is technically known as a ‘subtractive colour scheme’. The CMYK model works by partially or entirely masking colours on a lighter, usually white, background.
By far the most popular RGB scheme is an ‘additive colour scheme‘. They try to emulate the target colour by ‘adding’ the primary coloured lights (Red, Green, and Blue). The CMYK scheme is widely used in print media like the newspaper. The CMYK model works by partially or entirely masking colours on a lighter, usually white, background. The ink reduces the light that would otherwise be reflected.
Looking for some great colour combinations? We have listed the top colours that you might need along with the hex colour codes.
In HTML (or CSS), colours can be specified in many different ways. Some of these methods are: by specifying the colour name, by specifying the RGB values, or by specifying the hexadecimal equivalent of the RGB value. You can also use the HSL equivalent of the colour, but it is less intuitive than the RGB or HEX value. In the following table, we list 32 of the most useful colours that you might need. We also include the HSV and CMYK equivalent of the colours which some other platforms use for representing the colour.
Name |
HEX | RGB (in range 0-255) | HSL (in ° and %) | HSV (in ° and %) |
CMYK (in %) |
Black | #000000 | (0, 0, 0) | (0°, 0, 0) | (0, 0, 0) | (0, 0, 0, 100) |
Silver | #C0C0C0 | (192, 192, 192) | (0°, 0, 75.3) | (0, 0, 75) | (0, 0, 0, 25) |
Maroon | #800000 | (128, 0, 0) | (0°, 100, 25) | (0, 100, 50) | (0, 50, 50, 50) |
Red | #FF0000 | (255, 0, 0) | (0°, 100, 50) | (0, 100, 100) | (0, 100, 10, 0) |
Green | #008000 | (0, 128, 0) | (120°, 100, 25) | (120, 100, 50) | (50, 0, 50, 50) |
Lime | #00FF00 | (0, 255, 0) | (120°, 100, 50) | (120,100,100) | (100, 0, 100, 0) |
Navy | #000080 | (0, 0, 128) | (240°, 100, 25) | (240, 100, 50) | (100, 100, 0, 49) |
Blue | #0000FF | (0, 0, 255) | (240°, 100, 50) | (240, 100, 100) | (100, 100, 0, 0) |
Gray | #808080 | (128, 128, 128) | (0°, 0, 50) | (0, 0, 50) | (0, 0, 0, 50) |
White | #FFFFFF | (255, 255, 255) | (0°, 0, 100) | (0, 0, 100) | (0, 0, 0, 0) |
Purple | #800080 | (128, 0, 128) | (300°, 100, 25) | (300, 100, 50) | (0, 50, 0, 50) |
Fuchsia | #FF00FF | (255, 0, 255) | (300°, 100, 50) | (300, 100, 100) | (0, 10, 0, 0) |
Olive | #808000 | (128, 128, 0) | (60°, 100, 25) | (60, 100, 50) | (0, 0, 50, 50) |
Yellow | #FFFF00 | (255, 255, 0) | (60°, 100, 50) | (60, 100, 100) | (0, 0, 100, 0) |
Teal | #008080 | (0, 128, 128) | (180°, 100, 25) | (180, 100, 50) | (50, 0, 0, 50) |
Aqua | #00FFFF | (0, 255, 255) | (180°, 100, 50) | (180, 100, 100) | (100, 0, 0, 0) |
Crimson | #DC143C | (220, 20, 60) | (348, 83, 47) | (348, 91, 86) | (0, 91, 73, 14) |
Hot Pink | #FF69B4 | (255, 105, 180) | (330, 100, 71) | (330, 59, 100) | (0, 59, 29, 0) |
Coral | #FF7F50 | (255, 127, 80) | (16, 100, 66) | (16, 69, 100) | (0, 50, 69, 0) |
Gold | #FFD700 | (255, 215, 0) | (51, 100, 50) | (51, 100, 100) | (0, 16, 100, 0) |
Lavender | #E6E6FA | (230, 230, 250) | (240, 67, 94) | (240, 8, 98) | (8, 8, 0, 2) |
Medium Spring Green | #00FA9A | (0, 250, 154) | (157, 100, 49) | (157, 100, 98) | (100, 0, 38, 2) |
Royal Blue | #4169E1 | (65, 105, 225) | (225, 73, 57) | (225, 71, 88) | (71, 53, 0, 12) |
Chocolate | #D2691E | (210, 105, 30) | (25, 75, 47) | (25, 86, 82) | (0, 50, 86, 18) |
Snow | #FFFAFA | (255, 250, 250) | (0, 100, 99) | (0, 2, 100) | (0, 2, 2, 0) |
Slate Gray | #708090 | (112, 128, 144) | (210, 13, 50) | (210, 22, 56) | (22, 11, 0, 44) |
Peru | #CD853F | (205, 133, 63) | (30, 59, 53) | (30, 69, 80) | (0, 35, 69, 20) |
Turquoise | #40E0D0 | (64, 224, 208) | (174, 72, 56) | (174, 71, 88) | (71, 0, 7, 12) |
Violet | #EE82EE | (238, 130, 238) | (300, 76, 72) | (300, 45, 93) | (0, 45, 0, 7) |
Khaki | #F0E68C | (240, 230, 140) | (54, 77, 75) | (54, 42, 94) | (0, 4, 42, 6) |
Sky Blue | #87CEEB | (135, 206, 235) | (197, 71, 73) | (197, 43, 92) | (43, 12, 0, 8) |
Misty Rose | #FFE4E1 | (255, 228, 225) | (6, 100, 94) | (6, 12, 100) | (0, 11, 12, 0) |
Xterm is a popular terminal emulating software for the Unix-like operating systems. Xterm is highly configurable and boasts many fancy and unusual features which are not present in the other terminal emulators.
It supports colour texts – one of its many handy features. In the following table, we list some of the most used colour names and their corresponding HEX, RGB, and HSL codes. The first 16 of these colours are system colours.
Name |
System/Additional | HEX | RGB (in range 0-255) |
HSL (in ° and %) |
Black | System | #000000 | (0, 0, 0) | (0, 0, 0) |
Navy | System | #000080 | (0, 0, 128) | (240, 100, 25) |
Maroon | System | #800000 | (128, 0, 0) | (0, 100, 25) |
Green | System | #008000 | (0, 128, 0) | (120, 100, 25) |
Olive | System | #808000 | (128, 128, 0) | (60, 100, 25) |
Purple | System | #800080 | (128, 0, 128) | (300, 100, 25) |
Teal | System | #008080 | (0, 128, 128) | (180, 100, 25) |
Silver | System | #C0C0C0 | (192, 192, 192) | (0, 0, 75) |
Grey | System | #808080 | (128, 128, 128) | (0, 0, 50) |
Red | System | #FF0000 | (255, 0, 0) | (0, 100, 50) |
Lime | System | #00FF00 | (0, 255, 0) | (120, 100, 50) |
Yellow | System | #FFFF00 | (255, 255, 0) | (60, 100, 50) |
Blue | System | #0000FF | (0, 0, 255) | (240, 100, 50) |
Fuchsia | System | #FF00FF | (255, 0, 255) | (300, 100, 50) |
Aqua | System | #00FFFF | (0, 255, 255) | (180, 100, 50) |
White | System | #FFFFFF | (255, 255, 255) | (0, 0, 100) |
Grey3 | Additional | #080808 | (8, 8, 8) | (0, 0, 3) |
Navy Blue | Additional | #00005F | (0, 0, 95) | (240, 100, 18) |
Dark Green | Additional | #005F00 | (0, 95, 0) | (120, 100, 18) |
Deep Sky Blue4 | Additional | #005FAF | (0, 95, 175) | (07, 100, 34) |
Dark Cyan | Additional | #00AF87 | (0, 175, 135) | (66, 100, 34) |
Light Sea Green | Additional | #00AFAF | (0, 175, 175) | (180, 100, 34) |
Dark Red | Additional | #5F0000 | (95, 0, 0) | (0, 100, 18) |
Purple4 | Additional | #5F0087 | (95, 0, 135) | (82, 100, 26) |
Orange4 | Additional | #5F5F00 | (95, 95, 0) | (60, 100, 18) |
Royal Blue1 | Additional | #5F5FFF | (95, 95, 255) | (240, 100, 68) |
Cornflower Blue | Additional | #5F87FF | (95, 135, 255) | (225, 100, 68) |
Cadet Blue | Additional | #5FAFAF | (95, 175, 175) | (180, 33, 52) |
Chartreuse3 | Additional | #5FD700 | (95, 215, 0) | (3, 100, 42) |
Dark Magenta | Additional | #8700AF | (135, 0, 175) | (86, 100, 34) |
Dark Violet | Additional | #8700D7 | (135, 0, 215) | (77, 100, 42) |
Orange4 | Additional | #875F00 | (135, 95, 0) | (2, 100, 26) |
Plum4 | Additional | #875F87 | (135, 95, 135) | (300, 17, 45) |
Slate Blue1 | Additional | #875FFF | (135, 95, 255) | (255, 100, 68) |
Yellow4 | Additional | #878700 | (135, 135, 0) | (60, 100, 26) |
Indian Red | Additional | #AF5F5F | (175, 95, 95) | (0, 33, 52) |
Medium Orchid | Additional | #AF5FD7 | (175, 95, 215) | (280, 60, 60) |
Rosy Brown | Additional | #AF8787 | (175, 135, 135) | (0, 20, 60) |
Gold3 | Additional | #AFAF00 | (175, 175, 0) | (60, 100, 34) |
Tan | Additional | #D7AF87 | (215, 175, 135) | (30, 50, 68) |
Thistle3 | Additional | #D7AFD7 | (215, 175, 215) | (300, 33, 76) |
Light Golden rod2 | Additional | #D7D787 | (215, 215, 135) | (60, 50, 68) |
Deep Pink2 | Additional | #FF005F | (255, 0, 95) | (37, 100, 50) |
Light Coral | Additional | #FF8787 | (255, 135, 135) | (0, 100, 76) |
Orchid2 | Additional | #FF87D7 | (255, 135, 215) | (320, 100, 76) |
Light Salmon1 | Additional | #FFAF87 | (255, 175, 135) | (20, 100, 76) |
Navajo White1 | Additional | #FFD7AF | (255, 215, 175) | (30, 100, 84) |
Cornsilk1 | Additional | #FFFFD7 | (255, 255, 215) | (60, 100, 92) |