Color matching in web design is a headache, how can we match it with a pleasing color combination? Next, sister M will introduce some basic color principles and several related tools.
What is the color principle?
The principle of color contains many contents, but the most basic is the complementary, contrast and vitality of color.
Color complementation refers to the relationship between one color and other colors as we see it. When the selected color is at the poles of the color spectrum, it will neutralize a visual pleasure, which is complementary. There are two main ways of complementary colors: tri-color and composite color matching, which will be described in detail below. Mastering complex color complementary techniques can help us to take a step forward in design.
Color contrast can alleviate visual fatigue and keep the user's attention through the differentiation of different color elements. The most common use of color contrast is the contrast between the background color of the article and the font color.
If you look at the above pictures and have doubts about the use of color contrast in text, you can try the simplest: use a light background with dark text to ensure that no problems will occur. This is an example of color contrast. However, in most projects, the text part is not the place to highlight the design, so the design style should be simple and clear.
The principle of highlighting in text can also be used in web design. If the background color of the web page is dark, the text color is light. vice versa.
The vitality of color can indeed show the emotional side of the design. Bright colors make users feel full of energy. The use of bright colors is especially effective when selling products or seeking emotional resonance. Dark colors relax people and allow users to focus on something.
How to choose a color match?
There are three commonly accepted standards for color matching: tri-color, composite color, and similar colors.
A combination of three extreme colors on the spectrum. There is a very simple way to determine a trichromatic combination:
Take the excellent ring, determine a basic color starting from the basic color, draw an equilateral triangle on the color ring, the three fixed points where the equilateral triangle is located are the color combinations you want
Composite color matching (ie scattered complementary colors)
Composite color matching is based on a series of complementary colors: as shown above, select a set of relative colors on the color circle. Using this method, designers have more freedom to play, while getting good visual effects from complementary colors.
Similar colors are matched by selecting three adjacent colors from the color circle. Usually, the three colors selected are distinguished by color vitality and color contrast with each other.
The use of tools Thanks to the existence of many tools, it makes color design work extremely simple. At the same time, these tools can help us better understand the principle of color. Experiment under the guidance and learn how to apply the rules of color freely.
Kuler is a color matching tool released by Adobe, which aims to provide an intuitive way to create color palettes. Click to operate. Each color on the palette can be modified or selected as the base color. You can save or publish the palette. The Kuler website also provides many great community portals. Each color has an export function. But the interface interaction is more complicated, and adjusting the vitality of one color may change the entire color palette. In short, like those who have a good grasp of the concept and have enough patience to operate.
Color Scheme Designer
Color Scheme Designer is a very suitable software for beginners who lack patience (or catch up with deadlines). It provides a simple and controllable selector, easy to operate, and provides a variety of color combinations displayed according to the color principle, but does not tell the user the principles and reasons of these color combinations (from this point Kuler's dynamic color ring is more helpful).
Its "advanced options" are also very useful: for example, to adjust the color saturation and contrast of the entire palette, the web page preview function, etc., it is much better than Kuler. However, for those who need to learn the color principle, this tool is not recommended, because this software has helped users to complete a lot of color selection work, which is not conducive to users to perform experiments and learn more based on the basic principles.