Computer games- this is one of the most popular ways to have fun free time. Immersing ourselves in the world of a video game, we forget about real problems and troubles, relax and have fun. And if this is an online game or a game in multiplayer mode, then its main advantage is that here you can meet many people from all over the world and find not just like-minded people, but also best friends. Want to know how game settings, down to the color in MTA, can affect your interactions with other players? Read on!
Features of the multiplayer mode
Have you ever wondered: how to adjust colors in MTA or some other game? None of the people who have ever had the opportunity to play an online game with a large number of players will deny that they want to show themselves in the best light in front of others. You can boast about special expensive things your character, stand out in your knowledge of gaming terminology, or simply customize the interface of your game so that it will work better than that of inexperienced gamers.
Colors in "MTA" - what do you need to know?
If we talk about one of the versions of the multiplayer mode of the game "GTA: San Andreas", "MTA", then color plays a very important role here. The ability to customize the color of your nickname in MTA is one of the best skills that every beginning player should acquire.
So, to set up your nickname color, go to the "MTA: SA" application and click on the Settings option, then select your name, and then enter the desired color code right before it. In "MTA" there is a large palette of colors for nicknames. In the article we have included sample palettes from which you can choose the shade you like.
Now you know how you can stand out and make your nickname different from the nicknames of beginners and inexperienced players. Bright, it will distinguish you from ordinary gamers and attract more attention to you. Enjoy your game!
Unfortunately, taste sensations It is not yet possible to display on the website. But this can be fully compensated for with color range. After all, html colors allow you to display any of millions of shades. So " colored pencils There are many more than seven in his set.
Color scheme in html
In html, color can be specified in several formats:
1. As a hexadecimal value – the code specified in the hexadecimal number system is used. Such color codes in html consist of three pairs of hexadecimal numbers. Each pair is responsible for the saturation of the shade with its primary color:
- The first numerical pair is responsible for the color red;
- The second pair is for the green color content;
- The latter is for its blue content.
A hash mark is placed at the beginning of the code (before the numbers). This is the hexadecimal color code. In addition to numbers from 1 to 9, this number system uses letters of the Latin alphabet (A, B, C, D, E, F).
For example, the white color code in html will look like #FFFFFF:
2. Keyword - HTML currently supports about 147 keywords. But not all of these words are unique. Some of them refer to the same color shade.
The color gray is represented by two keywords: gray and gray . Their hexadecimal code (HEX) is given by the same value #808080.
Example:
#808080
3. In RGB format - this color encoding in html is based on the use of three values, set in the range from 0 to 255. Each of them determines the saturation of the hue with one of the primary colors:
- R – red (red);
- G – green (green);
- B – blue (blue).
The color number in RGB format is written in the following form: rgb(0, 210, 100).
background-color:rgb(100,186,43)
4. In the RGBA format - it is an improved RGB format, where the fourth value sets the color transparency in the form decimal from 0 to 1.
Usage example:
background-color:rgba(100,86,143,0.2)
background-color:rgba(100,86,143,0.5)
background-color:rgba(100,86,143,0.8)
background-color:rgba(100,86,143,1)
HTML color tables and color generators
With such a wide range of color setting formats, it's easy to get confused. Therefore, a special color table was invented. It provides 147 key names of color shades with compliance codes in all major color standards. Additionally, each field is equipped with a bar for visual color selection. One of these tables is presented on the website colorscheme.ru:
But even with this structuring of matching, choosing the right shade can be difficult. And it’s not a fact that the table of color codes will contain the one you need.
To get around this obstacle and make choosing the right shade as easy as possible, interactive web services have been developed. Their user interface may differ slightly from each other.
On the website html-color-codes.info the color generator looks like this:
And within the color-picker.appsmaster.co service, this tool is implemented a little differently:
The saturation of each color in the generator is set using special sliders. Visually, the shade is displayed by the color of the frame and rectangle on the left side. At the bottom, 3 fields display the color code in basic formats.
But the color generator is available not only on specialized sites. Almost all graphic editors are equipped with a similar tool. For example, Photoshop:
Safety precautions when working with color
And this was a long time ago, back in the era of video cards that supported only 256 colors. In those distant times OS could display only a certain number of eight-bit shades without distortion.
Then a great table of safe colors was developed. It specified 216 shades that could be displayed without distortion in any of the browsers of that time. And to this day this " great manuscript» is still available on some resources:
Nowadays everything has changed. Therefore, all safety rules when working with color in html are completely canceled. After all, modern computer hardware supports more than 16 million different shades. And 216 safe colors have sunk into oblivion.
These data are fully confirmed by statistics. Judging by it, in 2014, only 0.5% of users have computers that support only 256 shades.
Basics of color harmony
Not all of us are endowed with a natural harmonious sense of taste. That's why correct selection colors can be a real challenge. But, praise be to science, she even managed to describe color harmony in the form of several schemes. All of them are based on the use of a color wheel. Schemes for harmonious color selection in html:
- Parallel color scheme - when both shades in the color wheel are parallel;
- Triadic scheme - all corners of a triangle are based on one of the colors;
- Monochromatic - when several close shades of the same color are selected;
- Analog is a more advanced version of the monochromatic circuit. In this case, shades of the same color are located at a certain distance.
The implementation of all these schemes is well presented within the paletton.com service. It allows you to easily select a harmonious color.
Color codes in CSS are used to specify colors. Typically, color codes or color values are used to set the color for either the foreground of an element (e.g. text color, link color) or the background color of an element (background color, block color). They can also be used to change the color of a button, border, marker, hover, and other decorative effects.
You can specify your color values in various formats. The following table lists all possible formats:
The listed formats are described in more detail below.
CSS Colors - Hex Codes
Hexadecimal color code is a six-digit representation of color. The first two digits (RR) represent the red value, the next two represent the green value (GG), and the last two represent the blue value (BB).
CSS Colors - Short Hex Codes
Short hex color code is a shorter form of six-character notation. In this format, each digit is repeated to produce an equivalent six-digit color value. For example: #0F0 becomes #00FF00.
Hexadecimal value can be taken from any graphic software, such as Adobe Photoshop, Core Draw, etc.
Each hexadecimal color code in CSS will be preceded by a hash sign "#". Below are examples of using hexadecimal notations.
CSS Colors - RGB Values
RGB value is a color code that is set using the rgb() property. This property takes three values: one each for red, green, and blue. The value can be an integer, from 0 to 255, or a percentage.
Note: Not all browsers support the rgb() color property, so it is not recommended to use it.
Below is an example showing multiple colors using RGB values.
Color code generator
You can create millions of color codes using our service.
Browser Safe Colors
Below is a table of 216 colors that are the most secure and computer-independent. These colors in CSS range from 000000 to FFFFFF hexadecimal code. They are safe to use because they ensure that all computers display color correctly when working with the 256 color palette.
| Table of "safe" colors in CSS | |||||
| #000000 | #000033 | #000066 | #000099 | #0000CC | #0000FF |
| #003300 | #003333 | #003366 | #003399 | #0033CC | #0033FF |
| #006600 | #006633 | #006666 | #006699 | #0066CC | #0066FF |
| #009900 | #009933 | #009966 | #009999 | #0099CC | #0099FF |
| #00CC00 | #00CC33 | #00CC66 | #00CC99 | #00CCCC | #00CCFF |
| #00FF00 | #00FF33 | #00FF66 | #00FF99 | #00FFCC | #00FFFF |
| #330000 | #330033 | #330066 | #330099 | #3300CC | #3300FF |
| #333300 | #333333 | #333366 | #333399 | #3333CC | #3333FF |
| #336600 | #336633 | #336666 | #336699 | #3366CC | #3366FF |
| #339900 | #339933 | #339966 | #339999 | #3399CC | #3399FF |
| #33CC00 | #33CC33 | #33CC66 | #33CC99 | #33CCCC | #33CCFF |
| #33FF00 | #33FF33 | #33FF66 | #33FF99 | #33FFCC | #33FFFF |
| #660000 | #660033 | #660066 | #660099 | #6600CC | #6600FF |
| #663300 | #663333 | #663366 | #663399 | #6633CC | #6633FF |
| #666600 | #666633 | #666666 | #666699 | #6666CC | #6666FF |
| #669900 | #669933 | #669966 | #669999 | #6699CC | #6699FF |
| #66CC00 | #66CC33 | #66CC66 | #66CC99 | #66CCCC | #66CCFF |
| #66FF00 | #66FF33 | #66FF66 | #66FF99 | #66FFCC | #66FFFF |
| #990000 | #990033 | #990066 | #990099 | #9900CC | #9900FF |
| #993300 | #993333 | #993366 | #993399 | #9933CC | #9933FF |
| #996600 | #996633 | #996666 | #996699 | #9966CC | #9966FF |
| #999900 | #999933 | #999966 | #999999 | #9999CC | #9999FF |
| #99CC00 | #99CC33 | #99CC66 | #99CC99 | #99CCCC | #99CCFF |
| #99FF00 | #99FF33 | #99FF66 | #99FF99 | #99FFCC | #99FFFF |
| #CC0000 | #CC0033 | #CC0066 | #CC0099 | #CC00CC | #CC00FF |
| #CC3300 | #CC3333 | #CC3366 | #CC3399 | #CC33CC | #CC33FF |
| #CC6600 | #CC6633 | #CC6666 | #CC6699 | #CC66CC | #CC66FF |
| #CC9900 | #CC9933 | #CC9966 | #CC9999 | #CC99CC | #CC99FF |
| #CCCC00 | #CCCC33 | #CCCC66 | #CCCC99 | #CCCCCC | #CCCCFF |
| #CCFF00 | #CCFF33 | #CCFF66 | #CCFF99 | #CCFFCC | #CCFFFF |
| #FF0000 | #FF0033 | #FF0066 | #FF0099 | #FF00CC | #FF00FF |
| #FF3300 | #FF3333 | #FF3366 | #FF3399 | #FF33CC | #FF33FF |
| #FF6600 | #FF6633 | #FF6666 | #FF6699 | #FF66CC | #FF66FF |
| #FF9900 | #FF9933 | #FF9966 | #FF9999 | #FF99CC | #FF99FF |
| #FFCC00 | #FFCC33 | #FFCC66 | #FFCC99 | #FFCCCC | #FFCCFF |
| #FFFF00 | #FFFF33 | #FFFF66 | #FFFF99 | #FFFFCC | #FFFFFF |
In HTML, color can be specified in three ways:
Setting a color in HTML by its name
Some colors can be specified by their name, using the color name on the English language. The most common keywords: black (black), white (white), red (red), green (green), blue (blue), etc.:
Text color – red
The most popular colors of the World Wide Web Consortium (W3C) standard:
| Color | Name | Color | Name | Color | Name | Color | Name |
|---|---|---|---|---|---|---|---|
| Black | Gray | Silver | White | ||||
| Yellow | Lime | Aqua | Fuchsia | ||||
| Red | Green | Blue | Purple | ||||
| Maroon | Olive | Navy | Teal |
Usage example various colors s names:
Example: specifying a color by its name
- Try it yourself "
Header on red background
Header on orange background
Heading on lime background
White text on blue background
Header on red background
Header on orange background
Heading on lime background
White text on blue background
Specifying Color Using RGB
When displaying different colors on a monitor, the RGB palette is used as a basis. Any color is obtained by mixing three basic ones: R - red, G - green, B - blue. The brightness of each color is specified as a single byte and can therefore take values from 0 to 255. For example, RGB(255,0,0) is displayed as red because red is set to its most high value(255), and the rest are set to 0. You can also set the color as a percentage. Each parameter indicates the brightness level of the corresponding color. For example: the values rgb(127, 255, 127) and rgb(50%, 100%, 50%) will set the same green color medium saturation:
Example: Specifying Color Using RGB
- Try it yourself "
rgb(127, 255, 127)
rgb(50%, 100%, 50%)
rgb(127, 255, 127)
rgb(50%, 100%, 50%)
Set color by hexadecimal value
Values R G B can also be specified using hexadecimal (HEX) color values in the form: #RRGGBB where RR (red), GG (green) and BB (blue) are hexadecimal values from 00 to FF (same as decimal 0-255) . The hexadecimal system, unlike the decimal system, is based, as its name suggests, on the number 16. The hexadecimal system uses the following signs: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E, F. Here the numbers from 10 to 15 are replaced by Latin letters. Numbers greater than 15 in the hexadecimal system are represented by combining two characters into one value. For example, the largest number 255 V decimal system corresponds to the highest FF value in hexadecimal. Unlike the decimal system, a hexadecimal number is preceded by a hash symbol. # , for example, #FF0000 is shown as red because red is set to its highest value (FF) and the rest of the colors are set to their minimum value (00). Signs after the hash symbol # You can type in both uppercase and lowercase. The hexadecimal system allows you to use the abbreviated form #rgb, where each character is equivalent to double. Thus, the entry #f7O should be regarded as #ff7700.
Example: HEX Color
- Try it yourself "
red: #FF0000
green: #00FF00
blue: #0000FF
red: #FF0000
green: #00FF00
blue: #0000FF
red+green=yellow: #FFFF00
red+blue=purple: #FF00FF
green+blue=cyan: #00FFFF
List of common colors (name, HEX and RGB):
| English name | Russian name | Sample | HEX | RGB | ||
|---|---|---|---|---|---|---|
| Amaranth | Amaranth | #E52B50 | 229 | 43 | 80 | |
| Amber | Amber | #FFBF00 | 255 | 191 | 0 | |
| Aqua | Blue-green | #00FFFF | 0 | 255 | 255 | |
| Azure | Azure | #007FFF | 0 | 127 | 255 | |
| Black | Black | #000000 | 0 | 0 | 0 | |
| Blue | Blue | #0000FF | 0 | 0 | 255 | |
| Bondi Blue | Bondi beach water | #0095B6 | 0 | 149 | 182 | |
| Brass | Brass | #B5A642 | 181 | 166 | 66 | |
| Brown | Brown | #964B00 | 150 | 75 | 0 | |
| Cerulean | Azure | #007BA7 | 0 | 123 | 167 | |
| Dark spring green | Dark spring green | #177245 | 23 | 114 | 69 | |
| Emerald | Emerald | #50C878 | 80 | 200 | 120 | |
| Eggplant | Eggplant | #990066 | 153 | 0 | 102 | |
| Fuchsia | Fuchsia | #FF00FF | 255 | 0 | 255 | |
| Gold | Gold | #FFD700 | 250 | 215 | 0 | |
| Gray | Grey | #808080 | 128 | 128 | 128 | |
| Green | Green | #00FF00 | 0 | 255 | 0 | |
| Indigo | Indigo | #4B0082 | 75 | 0 | 130 | |
| Jade | Jade | #00A86B | 0 | 168 | 107 | |
| Lime | Lime | #CCFF00 | 204 | 255 | 0 | |
| Malachite | Malachite | #0BDA51 | 11 | 218 | 81 | |
| Navy | Dark blue | #000080 | 0 | 0 | 128 | |
| Ochre | Ocher | #CC7722 | 204 | 119 | 34 | |
| Olive | Olive | #808000 | 128 | 128 | 0 | |
| Orange | Orange | #FFA500 | 255 | 165 | 0 | |
| Peach | Peach | #FFE5B4 | 255 | 229 | 180 | |
| Pumpkin | Pumpkin | #FF7518 | 255 | 117 | 24 | |
| Purple | Violet | #800080 | 128 | 0 | 128 | |
| Red | Red | #FF0000 | 255 | 0 | 0 | |
| Saffron | Saffron | #F4C430 | 244 | 196 | 48 | |
| Sea Green | Green sea | #2E8B57 | 46 | 139 | 87 | |
| Swamp green | Bolotny | #ACB78E | 172 | 183 | 142 | |
| Teal | Blue-green | #008080 | 0 | 128 | 128 | |
| Ultramarine | Ultramarine | #120A8F | 18 | 10 | 143 | |
| Violet | Violet | #8B00FF | 139 | 0 | 255 | |
| Yellow | Yellow | #FFFF00 | 255 | 255 | 0 | |
Color codes (background) by saturation and hue.
CSS is not understood). Therefore, the future webmaster simply needs to study HTML tools that allow you to change color, for example, to make bright and colorful e-mail newsletters that will attract the attention of the site's target audience.
This post is quite lengthy, but from it you will learn about all the technical features of working with color using HTML. We will begin the recording by understanding the question: why do we need to highlight certain elements of an HTML page with color? Then we'll talk about the RGB model, which allows you to set colors in HTML using special codes (along the way, we'll look at decimal color codes and hexadecimal HTML color values). Also from this post you will learn about the color palette, and also understand why there is no palette in HTML. And at the end of this publication there will be examples of changing background color, text and links.
Using colors in HTML
Website pages would be boring and uninteresting without images, as we talked about earlier and in great detail. But images have one significant disadvantage: each image is an additional one and, accordingly, an additional load on the hosting.
I would like to note that I did not use a single image to design my WordPress blog; the layout was completely designed using color. Just the same Today we’ll talk about colors in HTML. Colors in HTML are used for different purposes, for example, we can design website layouts by highlighting certain items with one color or another.
Using color, we can focus the attention of our visitors on a particular text or block of the site. Note that it is also determined using color in such a way that the user can understand: which link he has already clicked on, which link he has not yet visited and which HTML page he is on. this moment.
Be careful using colors to design HTML documents, not all colors go together and not every color will be pleasing to your website visitors. But you’d better ask web designers about these subtleties; this article will help you understand the technical features that allow you to control the color of HTML page elements.
But you should not forget that the design should be separated from the content, so it is better to use CSS to manipulate color on HTML pages, but we will talk about this in another post. Now we'll see What tools does HTML have for controlling color on site pages?.
In the IT industry, there are many color models for color manipulation. The most widely used color representation model is the RGB model. We will talk about some of the features of this model here, and there will be a separate publication for a more detailed introduction to RGB. Below you will find a list of color models used in IT (not just HTML and CSS):
- RGB model. This model has become very widespread and is perhaps one of the most convenient and common ways to manipulate the color of HTML elements.
- Model RGBA. This model is very similar to the RGB model, but includes an alpha channel for the color. The special feature of the RGBA model is that it allows you to adjust not only the color of the HTML element, but also its transparency due to the presence of an alpha channel. The RGBA model was added to CSS3 and is not supported by older browsers.
- Model HSL. The peculiarity of the HSL model is that we set the color using its parameters: hue, flatness and lightness. This model is somewhat more difficult to understand than the RGB model.
- Model HSLA. This model is very similar to the HSL model, but just like the RGBA model, it allows you to work with the alpha color channel, so using HSLA we can set not only the color of an HTML element on the page, but also its transparency.
- Model HSV (HSB). This model should not be confused with the HSL model. Note that the first four models can be used in HTML or CSS to design web pages, but the HSV model cannot. The HSV was designed by one of the founders of Pixar in 1978 and is very similar to the HSL.
- Model CMY or CMYK. This model is used in all color printers for printing. The CMYK model is based on the rule that printing occurs on white sheets of paper. Any CMYK color is obtained by mixing Cyan (pale blue, turquoise), Magenta (magenta) and yellow. Each color in the CMY model has an opacity characteristic (amount of ink), measured as a percentage. But in addition to the three colors listed, the CMYK model also uses black.
All of the above color models are hardware dependent, that is, if you set the color of an HTML element using the RGB or HSL model, then it is impossible to say with certainty what exact shade of color a visitor to your site will see, since the monitors of all users are different and they convey colors differently. Also note that all of the above models are based on the RGB model and any color specified in any of the models (except HSLA and RGBA due to the presence of an alpha channel) can be converted to RGB.
If we talk about hardware-independent color transfer models, then it is worth noting the LAB model. So, we took a little break from working with color in HTML by getting acquainted with some color models. Note that browsers “understand” only the first four models: HSL, RGB, HSLA and RGBA. Therefore, we can only control the color of HTML elements using these models.
How the color of an HTML element is formed: some features of the RGB model
Let's figure it out how the color of an HTML element is formed and with some features of the RGB model. Note that we will talk about the RGB model, as well as other models that are used to design web pages, a little later in separate posts.
So, the RGB model stands for Red, Green, Blue. The RGB model is based on the principle of additivity. This principle is that to obtain any color, color is added to black. For a better understanding, imagine that your screen is a black wall and you have three spotlights: the first one shines red, the second one shines green, and the third one shines blue. You can adjust the brightness of each spotlight using a ruler with numbers from 0 to 255. Accordingly, if you set the spotlight to zero, it turns off and does not shine; if the value is 255, then the spotlight produces the brightest color possible.
Thus, it turns out that if you shine a red and a green spotlight on the same point, then you will notice a yellow spot on a black wall. If you combine red and blue, you get purple, and if you combine green and blue, the light spot on a black wall will be Cyan, but if you point all three spotlights at one point, the light spot will be white.
The principle described above underlies the RGB model and is used to manipulate colors in HTML elements on a page in a browser.
HTML attributes for changing the color of elements: the background color of the element and the color of the text inside the element
Used to make page elements unique. Using HTML attributes we can manipulate the color of elements:
- HTML attribute color. This attribute allows you to change the color of the text inside the HTML element. The attribute can take values in the form of HTML color names and RGB model codes in hexadecimal and decimal notations. The color attribute is a unique HTML attribute that allows you to change the color of text inside some HTML elements.
- HTML text attribute. This attribute is a unique tag attribute . Tag along with tags And form . If you remember, inside the container elements are placed that are then displayed by the browser in the viewing area. The text attribute allows you to specify Default text color for entire HTML page.
- HTML attribute bgcolor. It is also a unique HTML attribute and allows you to change the background color of some HTML elements.
- HTML attribute vlink. This attribute is unique and applies only to the tag to change the color of a link that the user has already visited.
- HTML attribute alink. This attribute is also unique and only applies to the tag . The alink attribute changes the color of the active HTML link.
- HTML link attribute. The link attribute is used only in conjunction with a tag and serves to change the color of HTML page links that the user has not yet visited.
Please note: using attributes to change the color of HTML elements is not recommended, as there are cascading style sheets that allow you to separate the design of a web page from its content.
Using Decimal Color Codes in HTML
So, we talked about the fact that you can set the brightness of the color of the spotlight using a special ruler on which there are numbered drawings from 0 to 255. Now let’s see how this will help us change the color of HTML elements. The thing is that we can change the color of the text inside an HTML element or the background color in HTML using decimal code as follows:
If you create an HTML document in which the body container is described, as in the example, you will see:
- The background color of the HTML document is now green: bgcolor=”rgb (0,255,0)”.
- Color HTML text page will turn blue: text=”rgb (0,0,255)”.
- The HTML color of a link that the user has not visited will be white: link=”rgb (255,255,255)”.
- The colors of the link that is currently open will be black: alink=”rgb (0,0,0)”.
- And the color of the HTML link that has already been visited will be red: vlink=”rgb (255,0,0)”.
Please note: no one forbids you to adjust the “spotlight power” at your discretion, you can set HTML color, for example, this way:
rgb(94, 85, 50) |
And get the color of childish surprise. This is the peculiarity, flexibility and convenience of the RGB model. Your monitor is a black wall with spotlights shining on it, and you can adjust the power of these spotlights and create all sorts of background, text and link colors using HTML attributes in the decimal notation system, or, you can also say: using decimal color codes.
In fact It's wrong to say decimal color codes in HTML, it would be more correct to say RGB decimal color codes, since this model is used not only for designing web pages in HTML and CSS.
Hexadecimal HTML color values
Setting the color of HTML elements using decimal codes of the RGB model is not very convenient (and at the moment, not all browsers support this method of color manipulation), since the recording will not be the most compact; it is much more convenient to set the color of HTML elements using hexadecimal values. In the image below you can see how decimal values are converted to hexadecimal.
For those who are not familiar with the hexadecimal number system, a little explanation should be given so that you can easily manipulate the color of HTML elements using hexadecimal RGB model codes. Firstly, the decimal number system is so named because any number can be obtained by a combination of ten digits (terminology is important: there is a difference between a number and a digit): 0, 1, 2, 3, 5, 6, 7, 8, 9.
In the hexadecimal number system, any number can be written using a combination of sixteen digits: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, a, b, c, d, e, f. For ease of understanding, you can assume that a is ten and f is fifteen. For example, the number sixteen would be written in hexadecimal as follows: 10. And the number 255 would be written as ff.
Now let's see how we can set the color of HTML elements using hexadecimal values, let's repeat our previous example, replacing the decimal color codes with their hexadecimal counterparts:
< body alink = ”#000000” link=”#ffffff” vlink=”ff0000” bgcolor=”#00ff00” text=”#0000ff”> |
Note: writing color in HTML in hexadecimal format is somewhat more compact than in decimal, that's the first one. Second: the power of each spotlight is set by numbers from 0 to 255. To write the number 255 requires two digits in hexadecimal format (ff = 250), so the brightness of each color channel (our spotlights are correctly called the color channel, color channel) is set by two digits from 0 to f.
Please note: the brightness of each color channel is set separately, but if we imagine that this is a single number, then the maximum possible number in the hexadecimal number system of the RGB model is ffffff, it will give us White color, and in the decimal system it is: 16,777,215. This number of colors and shades allows you to set/use the RGB model. This number comes from the fact that each color channel has 256 brightness values (from 0 to 255), respectively: 256 * 256 * 256 = 16,777,215.
Hexadecimal HTML color values are more compact and clearer, most web designers and layout designers use hexadecimal values to manipulate color in HTML, so we recommend that you do not get used to the decimal form of color notation, but immediately use hexadecimal.
It is clear that at first it will be difficult for a novice designer or layout designer to navigate the hexadecimal form of color notation, so almost any graphic editor has a so-called color palette, which allows you to select the desired color and get its code for different color models in different number systems.
Some text editors, such as , have palette extensions that are very handy when you want to quickly select a color and change it. I can’t say anything about this in this regard.
Color names in HTML
HTML attributes can take as values not only decimal codes and hexadecimal values, but also special flower names. Changing the color of HTML elements using its name is not a good idea. Firstly, behind the color name in HTML lies the RGB model code, and secondly, each browser displays the color of the HTML element specified by the name differently, it depends only on the desire of the browser developers.
That's why using a color name in HTML is not recommended. The RGB model is hardware dependent, and the color specified by the name depends on the browser and even its version. Let's try to set the color of the HTML page elements using the name:
< body alink = ”black ”link = ”#white” vlink=”red” bgcolor=”green” text=”blue”> |
As you understand, there are a lot of colors and shades. It’s worth noting here that HTML attributes do not allow you to set a gradient; CSS has this option, but we’ll talk about that in another post. And many colors in HTML have names. You can find a table of color names in HTML and their RGB codes on my website.
The table above demonstrates what color the HTML element will get if you specify it using the name. This table contains 16 colors and their names that are approved by the W3C and should be displayed the same in any browser. But in fact, in HTML you can use about 200 color names that are supported by major browsers, such as: Opera, Chrome, Firefox, Safari, Internet Explorer (including the latter this statement very controversial).
HTML color palette
In fact there is no color palette in HTML. Let's remember the definition of the word palette. A palette is a small thin board of a quadrangular or oval shape on which the artist mixes paints and obtains all kinds of colors. Sometimes a hole is made in the palette for the thumb to make it comfortable to hold. You will find an image of the palette below. That's why there is no palette in HTML.
But in different text editors There is color palette plugins that help quickly select the color of an HTML element. There is also a color palette in graphic editors, because it is not very convenient and fun for a designer to sit and calculate: what color will come out at this or that brightness of this or that channel. In the picture below you can see the simplest palette of the Paint editor.
Note that many color palette modules and plugins allow you to obtain a color code not only in the RGB/RGBA format, but also in the format of other models. Remember that there is no palette in HTML, well, unless you are an artist to the core and you call the color palette of the HTML page those colors that were used to decorate it (after all, sometimes a palette refers to the colors that a particular artist uses, or the colors that were used in the creation of a particular painting).
Learning to change text color in HTML
We got a lot of theory about colors in HTML, let's get to practice and try work with colors of HTML elements. The first thing we will learn to do is change text color in HTML document using special attributes and tags. Open any editor and write the following code in it:
Learning to work with color in HTML
Changing the text color
To change the color of the text, we can use the unique attribute of the BODY text element, and we can also use the FONT element and its color attribute. This text will be grayed out.
< ! DOCTYPE html > < html lang = "ru-RU" > < head > < meta charset = "UTF-8" > < title >Changing the color of the text in the HTML document< / title > < link rel = "stylesheet" type = "text/css" href = "style.css" / > < / head > < body text = "#ff0000" > < h1 > < font color = "rgb(0,255,0)" >Learning to work with color in HTML< / font > < / h1 > < h2 > < font color = "yellow" >Changing the text color< / font > < / h2 > < p >To change the text color we can use a unique element's BODY text attribute, and also use the FONT element < / body > < / html > |
I will save this file as color.html and advise you not to forget about . Recording color in the decimal number system is not supported by Chrome, Firefox and Opera, but IE understands this color notation and highlights the HTML header in green:
The correct thing to say is not changing the text color in HTML, but changing the font color in HTML. About