Matching Colors for the Website

How do we perceive colors?

Before I will proceed to matching colors in website, I would like to focus about biology of our sight. Every different eye perceives a differential range of colors, although it is traditionally contained within a certain range, specific for a human being. Based on the research, it was assumed that female specimens recognize the most colors. In nature, the male is usually colorful, and the female has a poorer range of coloration – the male tries to convince his partner that he is healthy and strong with his colorful coloration. In humans, on the contrary, women usually wear provocative colors, although in recent years this trend has been reversed. Does this mean that our biological preferences, which have been ingrained over the years, are changing? Perhaps, I will try to find out more about the taste of colors in bugslife.

The ability to perceive colors can be trained like any other, it takes appropriate training and many hours of practice. Choosing colors for graphic designs is one of the first stages of design, so it is worth knowing which colors can be combined and which should not.

Why are consistent colors on the website a key element in its reception?

The reception of a site containing subdued colors and color harmony is perfect. Then you can easily focus on the content. Of course, the most important elements, such as call-to-action buttons (CTA), should be highlighted, but not in a pushy or flashy way. Beautiful photos or images with an excess of colors are also not recommended due to the perceptual limitations of our brains. The more complicated and detailed the graphics, the less chance that its surroundings will be noticed.

How to choose colors for a website?

The colors of the website should be the background of the logotype’s color concept. A well-designed website is consistent in every area, including colors. Color sense is another matter, some have talent and others have to learn it. Currently, there are thousands of color tools on the web for determining colors, containing a color wheel scheme and suggestions for complementary colors, but before we focus on teaching and technological aids, there is one more very important issue, namely whether we have the logotype that we will use to design the site, it is in CMYK, RGB or other color space.

Matching colors from different color spaces can be tricky. This is a key element as you may find that the recipient is not satisfied with what he sees on the screen compared to the printout. The color space for computer graphics displayed on the screen is RGB. All other color spaces are converted to it when displayed on your screen. If the recipient is not satisfied, you should use colors that will reflect the colors as closely as possible. This process can be arduous sometimes, but it is well worth the time.

Graphics display probblem

An additional aspect that works to the disadvantage of the designer is the fact that each graphics card, software or monitor affects the perception of colors differently. Of course, there are standards, the behavior of which is unchanged, but it is worth remembering, especially in the case of demanding recipients. You will approach it differently when at the beginning there is a need to create a logotype and you will have to take care of complete visual identification for your recipient.

Having clearly defined RGB colors of the logotype, we can start defining the colors for the website. Based on my own experience, I decided that the leading color in the logo should not be the leading color of the website. The leading one, that is, the one that will dominate the entire project. I often use color triangulation, less often square or hexagon. It consists in the fact that I define the leading color on the color wheel, which becomes the vertex of an isosceles triangle, I bring out its arms and points that constitute its vertices, which are the two colors that I will define as leading in the website, excluding the one that dominates in the logo.

Then I extract these colors in a hexadecimal form, interpreted by web browsers and use a very interesting tool that will tell me what are the friendly colors for the two that I have chosen. How do I do it? I use colors.co for this purpose. The simplest and friendliest tool I have found in the last few years. Of course, you can completely base the logotype and colors of the website on the basis of a randomly generated scheme, but without control, we will not get positive end results. That’s it for the moment. If you want me to supplement the content with additional information, feel free to comment. Please also rate the article.

Leave a Comment