How to Apply color matching techniques in Design

Professional designers must be very sensitive to the use of color, whether it is the design of web pages, plan, logo and so on. We use different colors. For example, white, black, and gray are often used as dominant colors. The content discussed in this article is mainly about how to apply color matching in the design, so that the final effect is not messy, not dull. And aesthetic.

With the color wheel, we can easily turn a promotion card for a resort into a series of designs with different colors.

Have you ever thought about how to make you pay less and get more? In this article, we will discuss the design of a Series card. The color of each card is completely different, but it makes people feel like a series design. This design can be easily completed, it takes little time and effort to design. We use a vector image to produce different visual effects. Let's take a look at how we implement it.

Starting from a vector image:

A vector image is generated by a drawn program. Unlike a photo, the line and shape in the vector format are objects rather than pixels.

There are two image formats:

Grid Format:

Generally, a photo is composed of tiny pixels in the grid. Its color is rich and vivid, and its gradient is rich. The disadvantage is that it is very troublesome to modify images. The word Raster comes from German, meaning Raster.

Vector format:

Vector format is to use the positioning point to connect the line and curve, like Adobe Illustrator software, is to process vector format software. The advantage of vector format is that it is very easy to trim images, and you can zoom in or out without compromising the image quality, and the stored files are also very small. "Vector" is a mathematical term that refers to the relationship between a point in a space and other objects.

The vector format is very easy to adjust:

The features of vector format make it easy to move elements, change shapes, fill colors, and other operations.

Observe carefully: before you start to work, let's take a look at the composition of the pattern we are facing and the relationship between each element.

Place and crop a pattern:

At the beginning, we had to deal with the diagram. In this design, in order to convey a flourishing and garden atmosphere, our flowers accounted for about 60% of the design layout, we can.

Observe the color: to make the color of this card easy to achieve the beautiful effect, we cannot pick some colors at will. We need to understand the relationship between colors. Therefore, we need to take advantage of the color wheel, which simplifies countless colors into 12 basic colors.

12 basic colors, plus bright and dark colors. The color ring in the middle is 12 base colors, while the top is: (1) yellow, red, and blue are the three primary colors. Only these three colors are not adjusted by other colors. (2) secondary colors are the colors in the middle of the primary colors. Each secondary color is a color that is equivalent to two adjacent primary colors. (3) In the remaining color, it is three colors. They are formed by the combination of adjacent primary colors and secondary tones. The inner ring and outer ring are both bright and dark colors. They are made by adding white and black colors.

Color gamut: there are no numbers of beautiful color changes in the real world, but to make the design simple, we only select the existing color in the color wheel. We will use analog colors to achieve a harmonious effect, and then use complementary colors to produce comparison and differences.

The same/opposite: in the middle, the combination of adjacent colors (that is, the analogy colors) always produces a harmonious visual effect, because they all contain a large number of identical colors. In the area shown above, each color is yellow. The other side is complementary. The two colors of Mutual Complementary colors mean that they do not share the same color, so complementary colors can produce a strong contrast.

Bright and dark colors: to extend the color gamut range selected in our design, we highlight or darken the entire color wheel by adding white or black. These are unsaturated colors. Unsaturated colors usually give people a soft, low-key, hazy, and more meaningful feeling. Interestingly, although we take colors from three color wheels, the selected colors can be exchanged because they all share the same base color.

Start color Filling

What we need to do now is to design the card by dividing the color wheel into 12 steps and two colors of light and shade. The pattern uses an analogy, while the text uses a complementary color. Let's take a look at the effect:

First:

Click to view the chart

Second:

Click to view the chart

Third:

Click to view the chart

Fourth:

Click to view the chart

Category 5:

Click to view the chart

Sixth:

Click to view the chart

7:

Click to view the chart

Eighth type:

Click to view the chart

Ninth:

Tenth type:

11th types:

12th types:

Internal page design:

In general, the design of the internal page should be more concise than that of the external page. We use one or two elements from the original pattern to adjust the size and change the position.

The same background and pattern: in the design of the inner page above, we use two elements from the original pattern to design and zoom in. One element flipped and rotated the image. The simplest way to color is to directly use the color of the outer page on the inner page, which makes the color of the two pages inside and outside naturally form a good matching effect.

Use the same font: the body of the internal page is not the same as that of the title of the external page, but we must follow the principle of continuity, the text on the internal page should be in harmony with the text on the external page. In this example, we use the title Font (Didot HTF 24 Light Roman font) on the outer page for sinking letters ), the text uses the font (Mrs Eaves Italic font) used by the "Siganus Island" on the outer page ).

The color value used in this article: