📜 ⬆️ ⬇️

Color theory

The first impression is everything. The proverb “They meet clothes, they escort them by mind” is relevant not only in life but also in design. The impression of design consists of many factors, and one of the most important is color.

Understanding which colors fit together is not always easy, this article describes the basics of color theory, which will come in handy when choosing a color scheme for website design. Let's start with the simplest.

Primary Colors (Primary Colors)



')
The main colors of the palette are red, yellow and blue. If we talk about the main colors on the screens of various devices - it is RGB, red, green and blue.

Secondary colors




If you mix red and yellow evenly, yellow and blue, blue and red you get respectively secondary colors - orange, green and purple. The combination of these colors in the design can give a contrast to the design.

Tertiary Colors




Tertiary color is obtained if you mix the primary and secondary. For example, red-violet, blue-violet, blue-green, yellow-green, red-orange, yellow-orange.

We figured out the basics of the “flower wheel”. With it, it is easy to select well-matched colors for design. Let us turn to more complex combinations.

Complementary Colors






As is clear from the diagram, the complementary colors are opposite to each other on the wheel. Give the design more contrast, but they should be used with caution, otherwise it will be “tear-eye-design”

Similar colors (Analogous Colors)






Located next to the wheel of flowers. Neighboring colors create a sense of diversity, such as blue-green or yellow-orange.

Triads






Using the triads on the color wheel, you can achieve a sufficient variety, but at the same time a good balance.

Split Complementary Colors



This color combination adds contrast and variety to the design.

Square Pattern




This scheme works well with one enhanced color and three muffled.

Rectangular scheme (Tetradic Colors)




It is similar to the previous scheme, or rather just its variation.

Use of light and shadow (Tints and Shades)




Gives the design volume and color variety.

Warm and cold colors (Warm and Cool Colors)







Cold and warm colors are classic color schemes themselves. Their main difference in human perception. Warm colors cause summer associations: heat, sun, green landscapes, and cold colors are associated with winter: cold, snow, cloudy weather.

Understanding color theory and competently using it in practice is one of the most important skills of a good designer. Proper color combinations on the site improves the overall perception of the design and can cause a variety of emotions.

In addition, I can advise kuler - a very cool service for the selection of color schemes from Adobe.



Pictures of flower wheels from here .

PS shalaev added another great service - colorschemedesigner.com .

Source: https://habr.com/ru/post/155085/


All Articles