This page provides a table with keywords that can be used to denote colors in web development languages such as HTML, CSS, JavaScript, Flash, and more.
In the old specifications of the WC3 concern, only 16 keywords were spelled out, with the help of which colors were set in HTML and CSS. In later, more recent specifications, 130 more keywords have been added to denote color names. The following table lists the color names, hexadecimal and RGB codes they correspond to.
According to CSS rules, color names are not case sensitive. IndianRed and indianred color entries are equivalent.
It is also worth noting that of the 146 keywords of the table, there are actually fewer colors in it. This is because some keywords mean the same color. So the names Gray and Gray stand for 50% gray with the code # 808080, and the word Magenta is a synonym for the HTML color Fuchsia, which corresponds to the hex code # FF00FF. Also synonyms are the words Aqua and Cyan, they correspond to the code # 00FFFF.
|
|
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Hexadecimal numbers are used to set colors. The hexadecimal system, in contrast to the decimal system, is based, as its name suggests, on the number 16. The numbers will be as follows: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C , D, E, F. Numbers from 10 to 15 are replaced by Latin letters. Numbers greater than 15 in hexadecimal are formed by combining two numbers into one. For example, 255 decimal equals FF hexadecimal. To avoid confusion in the definition of the number system, the hash character # is placed in front of the hexadecimal number, for example # 666999. Each of the three colors — red, green, and blue — can range from 00 to FF. Thus, the color designation is divided into three components #rrggbb, where the first two characters mark the red component of the color, the two middle ones - green, and the last two - blue. It is allowed to use an abbreviated form like #rgb, where each character should be doubled. So, the # fe0 entry should be treated as # ffee00.
By name
| Internet Explorer | Chrome | Opera | Safari | Firefox | Android | iOS |
| 4.0+ | 1.0+ | 3.5+ | 1.3+ | 1.0+ | 1.0+ | 1.0+ |
Browsers support some colors by name. Table 1 shows the names, hexadecimal code, RGB, HSL values and description.
| Name | Color | The code | RGB | Hsl | Description |
|---|---|---|---|---|---|
| white | #ffffff or #fff | rgb (255,255,255) | hsl (0.0%, 100%) | White | |
| silver | # c0c0c0 | rgb (192,192,192) | hsl (0.0%, 75%) | Grey | |
| gray | #808080 | rgb (128,128,128) | hsl (0.0%, 50%) | Dark grey | |
| black | # 000000 or # 000 | rgb (0,0,0) | hsl (0.0%, 0%) | Black | |
| maroon | #800000 | rgb (128,0,0) | hsl (0.100%, 25%) | Dark red | |
| red | # ff0000 or # f00 | rgb (255,0,0) | hsl (0.100%, 50%) | Red | |
| orange | # ffa500 | rgb (255,165,0) | hsl (38.8,100%, 50%) | Orange | |
| yellow | # ffff00 or # ff0 | rgb (255,255,0) | hsl (60,100%, 50%) | Yellow | |
| olive | #808000 | rgb (128,128,0) | hsl (60,100%, 25%) | Olive | |
| lime | # 00ff00 or # 0f0 | rgb (0.255.0) | hsl (120,100%, 50%) | Light green | |
| green | #008000 | rgb (0.128.0) | hsl (120,100%, 25%) | Green | |
| aqua | # 00ffff or # 0ff | rgb (0,255,255) | hsl (180,100%, 50%) | Blue | |
| blue | # 0000ff or # 00f | rgb (0,0,255) | hsl (240,100%, 50%) | Blue | |
| navy | #000080 | rgb (0,0,128) | hsl (240,100%, 25%) | Navy blue | |
| teal | #008080 | rgb (0.128.128) | hsl (180,100%, 25%) | Blue green | |
| fuchsia | # ff00ff or # f0f | rgb (255,0,255) | hsl (300,100%, 50%) | Pink | |
| purple | #800080 | rgb (128,0,128) | hsl (300,100%, 25%) | Violet |
With RGB
| Internet Explorer | Chrome | Opera | Safari | Firefox | Android | iOS |
| 5.0+ | 1.0+ | 3.5+ | 1.3+ | 1.0+ | 1.0+ | 1.0+ |
You can determine the color using the decimal values of the red, green, and blue components. Each of the three color components takes a value from 0 to 255. It is also permissible to set the color as a percentage, while 100% will correspond to the number 255. First, the rgb keyword is indicated, and then in parentheses, the color components are indicated, separated by commas, for example rgb (255 , 128, 128) or rgb (100%, 50%, 50%).
RGBA
| Internet Explorer | Chrome | Opera | Safari | Firefox | Android | iOS |
| 9.0+ | 1.0+ | 10.0+ | 3.1+ | 3.0+ | 2.1+ | 2.0+ |
The RGBA format is similar in syntax to RGB, but includes an alpha channel that controls the transparency of the element. A value of 0 corresponds to full transparency, 1 to opacity, and an intermediate value like 0.5 to semi-transparency.
RGBA was added in CSS3, so CSS code validation should be done using this version. It should be noted that the CSS3 standard is still under development and some features may change. For example, an RGB color added to the background-color property is validated, but a color added to the background property no longer. At the same time, browsers quite correctly understand the color for both properties.
Hsl
| Internet Explorer | Chrome | Opera | Safari | Firefox | Android | iOS |
| 9.0+ | 1.0+ | 9.6+ | 3.1+ | 3.0+ | 2.1+ | 2.0+ |
The name of the HSL format is formed from a combination of the first letters Hue (hue), Saturate (saturation) and Lightness (lightness). Hue is the value of a color on the color wheel (Fig. 1) and is given in degrees. 0 ° is red, 120 ° is green, and 240 ° is blue. The hue value can range from 0 to 359.
Rice. 1. Color wheel
Saturation is the intensity of a color, measured as a percentage from 0% to 100%. A value of 0% denotes no color and a shade of gray, 100% is the maximum saturation value.
Lightness sets how bright the color is and is indicated as a percentage from 0% to 100%. Low values make the color darker, and high values lighten, extreme values of 0% and 100% correspond to black and white.
HSLA
| Internet Explorer | Chrome | Opera | Safari | Firefox | Android | iOS |
| 9.0+ | 1.0+ | 10.0+ | 3.1+ | 3.0+ | 2.1+ | 2.0+ |
The HSLA format is similar in syntax to HSL, but includes an alpha channel that defines the transparency of the element. A value of 0 corresponds to full transparency, 1 to opacity, and an intermediate value like 0.5 to semi-transparency.
Color values in RGBA, HSL, and HSLA formats have been added in CSS3, so be sure to check for version validity when using these formats.
HTML5 CSS2.1 CSS3 IE Cr Op Sa Fx
Warning
All the methods for catching a lion listed on the site are theoretical and based on computational methods. The authors do not guarantee your safety when using them and disclaim any responsibility for the result. Remember, the lion is a predator and a dangerous animal!
The result of this example is shown in Fig. 2.
Rice. 2. Colors on the web page
The CSS color module details the values that allow authors to define the colors and opacity of html elements, as well as the values of the color property.
Color property
1. Priority colors: the color property
The property sets the color of the font using various color rendering systems. The property describes the color of the text content of the element. It is also used to provide a potential indirect value (currentColor) for any other properties that accept color values.
The property is inherited.
2. Color values
2.1. Main keywords
The list of main keywords includes the following meanings:
| Name | HEX | RGB | Color |
|---|---|---|---|
| black | #000000 | 0,0,0 | |
| silver | # C0C0C0 | 192,192,192 | |
| gray | #808080 | 128,128,128 | |
| white | #FFFFFF | 255,255,255 | |
| maroon | #800000 | 128,0,0 | |
| red | # FF0000 | 255,0,0 | |
| purple | #800080 | 128,0,128 | |
| fuchsia | # FF00FF | 255,0,255 | |
| green | #008000 | 0,128,0 | |
| lime | # 00FF00 | 0,255,0 | |
| olive | #808000 | 128,128,0 | |
| yellow | # FFFF00 | 255,255,0 | |
| navy | #000080 | 0,0,128 | |
| blue | # 0000FF | 0,0,255 | |
| teal | #008080 | 0,128,128 | |
| aqua | # 00FFFF | 0,255,255 |
Color names are not case sensitive.
Syntax
Color: teal;
2.2. Numerical color values
2.2.1. RGB colors
The RGB hexadecimal value format is a # sign immediately followed by three or six hexadecimal characters. Three-digit RGB #rgb is converted to six-digit #rrggbb by copying digits rather than adding zeros. For example, # fb0 expands to # ffbb00. This ensures that white #ffffff can be specified in the short #fff, and removes any color depth dependencies from the display.
The RGB value format in functional notation is rgb (followed by a comma-separated list of three numeric values (either three integer values or three percent values) followed by a character). The integer value 255 corresponds to 100% and F or FF in hexadecimal notation:
Rgb (255,255,255) = rgb (100%, 100%, 100%) = #FFF
Space characters are allowed around numeric values.
There are several ways to represent color in web design.
HEX is a base 16 hexadecimal color representation system. For this system, Arabic decimal digits from 0 to 9 and Latin letters from A to F are used to complement the digital number to 16. For web design, 16 basic (key) colors are taken, the so-called hexadecimal color code #RRGGBB, where each pair is responsible for its share of the color: RR - red, GG - green and BB - blue. Each color fraction ranges from 00 to FF.
Two other representations of color in web design are: in the form of RGB (*, *, *), where each "*" color fraction is represented by decimal digits from 0 to 255 and by color names in English.
When creating a color image, the main problem is the correct rendering of colors on different types of computers, monitors and browsers. If the browser cannot display a color correctly, then it picks up a similar one or mixes several colors. And sometimes it can be replaced with some completely different color.
table 16 primary colors which are used in all browsers
| Name | Color | Hex | (RGB) |
| Aqua (sea wave) | # 00FFFF | (000,255,255) | |
| Black (black) | #000000 | (000,000,000) | |
| Blue | # 0000FF | (000,000,255) | |
| Fuchsia (fuchsin) | # FF00FF | (255,000,255) | |
| Gray (gray) | #808080 | (128,128,128) | |
| Green (green) | #008000 | (000,128,000) | |
| Lime (bright green) | # 00FF00 | (000,255,000) | |
| Maroon (maroon) | #800000 | (128,000,000) | |
| Navy (navy blue) | #000080 | (000,000,128) | |
| Olive (olive) | #808000 | (128,128,000) | |
| Purple | #800080 | (128,000,128) | |
| Red (red) | # FF0000 | (255,000,000) | |
| Silver (silver) | # C0C0C0 | (192,192,192) | |
| Teal (gray-green) | #008080 | (000,128,128) | |
| White (white) | #FFFFFF | (255,255,255) | |
| Yellow (yellow) | # FFFF00 | (255,255,000) |
table purple colors and shades
| Name | Color | Hex | (RGB) |
| Magenta (magenta) | #FFCBDB | (255,203,219) | |
| Magenta (magenta) | # FF0099 | (255,000,153) | |
| Magenta (magenta) | # F95A61 | (249,090,097) | |
| Fuchsia (fuchsia) | # FF00FF | (255,000,255) | |
| Movein (aniline purple) | # EF0097 | (239,000,151) | |
| Salmon pink (orange pink) | # FF91A4 | (255,145,164) | |
| Cenise (a shade of magenta) | # DE3163 | (153,149,140) | |
| Aubergine Eggplant (eggplant) | #990066 | (153,000,132) | |
| Lavender blush (pinkish lavender) | & nbsp # FFF0F5 | (255,240,245) | |
| Lilac (lilac) | # C8A2C8 | (200,162,200) | |
| Magenta (magenta) | # FF008F | (255,000,143) | |
| Orchid (orchid) | # DA70D6 | (218,112,214) | |
| Red-violet | # C71585 | (199,021,133) | |
| Sanguine (sanguine) | # 92000A | (146,000,010) | |
| Thistle (shade of magenta) | # D8BFD8 | (185,211,238) | |
| Violet-eggplant (shade of purple) | #991199 | (153,017,153) | |
| Rosa vivo (deep pink) | # FF007F | (255,000,127) | |
| Lavender-rose (shade of purple) | # FBA0E3 | (108,123,139) | |
| Mountbatten pink | # 997ABD | (153,122,141) |
table gray colors and shades
| Name | Color | Hex | (RGB) |
| Gray | #808080 | (128,128,128) | |
| Gray | #bebebe | (190,190,190) | |
| (Gray-tint) | #858585 | (133,133,133) | |
| Gray33 (Gray-33) | #545454 | (084,084,084) | |
| (Gray slate) | #708090 | (112,128,144) | |
| (Quartz) | # 99958с | (153,149,140) | |
| (Light gray) | #bbbbbb | (187,187,187) | |
| (Silver) | # c0c0c0 | (192,192,192) | |
| (Gray-white) | # f0f0f0 | (240,240,240) | |
| (Abdel-Kerim's beards) | # e0e0e0 | (224,224,224) | |
| LightGray (Light gray) | # d3d3d3 | (211,211,211) | |
| LightStateGray () | #778899 | (119,136,153) | |
| StateGray-1 (Pale cornflower blue1) | # c6e2ff | (198,226,255) | |
| StateGray-2 (Pale cornflower blue2) | # b9d3ee | (185,211,238) | |
| StateGray3 () | # 9fb6cd | (159,182,205) | |
| StateGray4 () | # 6c7b8b | (108,123,139) |
Table (palette) html colors gives you the opportunity to independently choose the tone you need. The color value is displayed in three formats: Hex, RGB, and HSV.
- Hex consists of three two character values in hexadecimal notation. For example: # ff00b3, where the first pair of numbers is red, the second is green, and the third is blue.
- RGB (RedGreenBlue) has the form "200,100,255" indicating the amount of the corresponding tone (red, green, blue) in the resulting color.
- HSV (Hue, Saturation, Value - hue, saturation, value) - color model, in which the coordinates are:
- Hue - hue, can vary from 0 ° to 360 °.
- Saturation - saturation, ranges from 0-100 or 0-1. The larger this parameter, the "purer" the color, which is why this parameter is sometimes referred to as color purity. And the closer this parameter is to zero, the closer the color is to neutral gray.
- Value (color value) - sets the brightness, the value can also vary between 0-100 or 0-1.
Enter color code: Go
List of colors with names
The table lists the English color names (which can be used as values) supported by all browsers and their hexadecimal values. All the listed colors are "safe", that is, they will be displayed the same in all browsers.
| Color name | HEX | Color |
|---|---|---|
| Black | #000000 | |
| Navy | #000080 | |
| Darkblue | # 00008B | |
| MediumBlue | # 0000CD | |
| Blue | # 0000FF | |
| DarkGreen | #006400 | |
| Green | #008000 | |
| Teal | #008080 | |
| DarkCyan | # 008B8B | |
| DeepSkyBlue | # 00BFFF | |
| Darkturquoise | # 00CED1 | |
| MediumSpringGreen | # 00FA9A | |
| Lime | # 00FF00 | |
| SpringGreen | # 00FF7F | |
| Aqua | # 00FFFF | |
| Cyan | # 00FFFF | |
| MidnightBlue | #191970 | |
| DodgerBlue | # 1E90FF | |
| LightSeaGreen | # 20B2AA | |
| ForestGreen | # 228B22 | |
| Seagreen | # 2E8B57 | |
| DarkSlateGray | # 2F4F4F | |
| LimeGreen | # 32CD32 | |
| MediumSeaGreen | # 3CB371 | |
| Turquoise | # 40E0D0 | |
| RoyalBlue | # 4169E1 | |
| SteelBlue | # 4682B4 | |
| DarkSlateBlue | # 483D8B | |
| MediumTurquoise | # 48D1CC | |
| Indigo | # 4B0082 | |
| DarkOliveGreen | # 556B2F | |
| CadetBlue | # 5F9EA0 | |
| CornflowerBlue | # 6495ED | |
| MediumAquaMarine | # 66CDAA | |
| DimGray | #696969 | |
| SlateBlue | # 6A5ACD | |
| OliveDrab | # 6B8E23 | |
| SlateGray | #708090 | |
| LightSlateGray | #778899 | |
| MediumSlateBlue | # 7B68EE | |
| LawnGreen | # 7CFC00 | |
| Chartreuse | # 7FFF00 | |
| Aquamarine | # 7FFFD4 | |
| Maroon | #800000 | |
| Purple | #800080 | |
| Olive | #808000 | |
| Gray | #808080 | |
| SkyBlue | # 87CEEB | |
| LightSkyBlue | # 87CEFA | |
| Blueviolet | # 8A2BE2 | |
| Darkred | # 8B0000 | |
| DarkMagenta | # 8B008B | |
| Saddlebrown | # 8B4513 | |
| DarkSeaGreen | # 8FBC8F | |
| LightGreen | # 90EE90 | |
| MediumPurple | # 9370D8 | |
| Darkviolet | # 9400D3 | |
| Palegreen | # 98FB98 | |
| DarkOrchid | # 9932CC | |
| YellowGreen | # 9ACD32 | |
| Sienna | # A0522D | |
| Brown | # A52A2A | |
| DarkGray | # A9A9A9 | |
| LightBlue | # ADD8E6 | |
| GreenYellow | # ADFF2F | |
| Paleturquoise | #AFEEEE | |
| LightSteelBlue | # B0C4DE | |
| PowderBlue | # B0E0E6 | |
| FireBrick | # B22222 | |
| DarkGoldenRod | # B8860B | |
| MediumOrchid | # BA55D3 | |
| RosyBrown | # BC8F8F | |
| Darkkhaki | # BDB76B | |
| Silver | # C0C0C0 | |
| MediumVioletRed | # C71585 | |
| IndianRed | # CD5C5C | |
| Peru | # CD853F | |
| Chocolate | # D2691E | |
| Tan | # D2B48C | |
| LightGray | # D3D3D3 | |
| PaleVioletRed | # D87093 | |
| Thistle | # D8BFD8 | |
| Orchid | # DA70D6 | |
| GoldenRod | # DAA520 | |
| Crimson | # DC143C | |
| Gainsboro | #DCDCDC | |
| Plum | # DDA0DD | |
| BurlyWood | # DEB887 | |
| LightCyan | # E0FFFF | |
| Lavender | # E6E6FA | |
| Darksalmon | # E9967A | |
| Violet | # EE82EE | |
| PaleGoldenRod | # EEE8AA | |
| LightCoral | # F08080 | |
| Khaki | # F0E68C | |
| AliceBlue | # F0F8FF | |
| HoneyDew | # F0FFF0 | |
| Azure | # F0FFFF | |
| Sandybrown | # F4A460 | |
| Wheat | # F5DEB3 | |
| Beige | # F5F5DC | |
| WhiteSmoke | # F5F5F5 | |
| MintCream | # F5FFFA | |
| Ghostwhite | # F8F8FF | |
| Salmon | # FA8072 | |
| AntiqueWhite | # FAEBD7 | |
| Linen | # FAF0E6 | |
| LightGoldenRodYellow | # FAFAD2 | |
| OldLace | # FDF5E6 | |
| Red | # FF0000 | |
| Fuchsia | # FF00FF | |
| Magenta | # FF00FF | |
| Deeppink | # FF1493 | |
| OrangeRed | # FF4500 | |
| Tomato | # FF6347 | |
| HotPink | # FF69B4 | |
| Coral | # FF7F50 | |
| Darkorange | # FF8C00 | |
| LightSalmon | # FFA07A | |
| Orange | # FFA500 | |
| LightPink | # FFB6C1 | |
| Pink | # FFC0CB | |
| Gold | # FFD700 | |
| PeachPuff | # FFDAB9 | |
| NavajoWhite | #FFDEAD | |
| Moccasin | # FFE4B5 | |
| Bisque | # FFE4C4 | |
| MistyRose | # FFE4E1 | |
| BlanchedAlmond | #FFEBCD | |
| PapayaWhip | # FFEFD5 | |
| LavenderBlush | # FFF0F5 | |
| SeaShell | # FFF5EE | |
| Cornsilk | # FFF8DC | |
| LemonChiffon | #FFFACD | |
| FloralWhite | # FFFAF0 | |
| Snow | #FFFAFA | |
| Yellow | # FFFF00 | |
| LightYellow | # FFFFE0 | |
| Ivory | # FFFFF0 | |
| White | #FFFFFF |
