Super cool color scheme in design
Many of you think that choosing colors for the user interface (UI) is mostly based on the aesthetic eyes and preferences of the designers. However, the reality is that the color selection process is more complicated than you know and contributes significantly to the design work.
Everyone knows that color has a great influence on our emotions and behavior. That explains why the success of the products comes from the choice of colors for the design. According to the research results of Colorcom, it only takes 90 seconds for us to subconsciously evaluate a product, of which 62% to 90% of the evaluation opinions are based solely on color. Therefore, appropriately selected colors will be an effective bridge between the product, as well as the usability of the product with the customer.
To come up with a beautiful design and use color well, you need to understand how colors are formed and related to each other. This article will introduce basic theories on how to combine colors effectively to apply in your design process.
Color Wheel (Color Wheel)
If you've ever taken a painting-related course, you've probably seen the color wheel below. We will rely on this circle to see how colors are formed and related to each other. The color circle is made up of three levels. The first level (primary color) consists of 3 colors: red (red), yellow (yellow), and blue (blue). Combining the color pairs of the first level we get the secondary color, and combining the color pairs of the second we get the third color (tertiary color) like red. -violet (red-violet).
The color wheel invented by Isaac Newton is still used today as the main tool in color mixing.
Color models
Before embarking on color matching, we need to know that colors are made up of two different sources in nature: tangible colors are colors on objects we touch, touch, and others. are made up of light with different wavelengths (like the colors on TV). These two color groups have two different color models: additive color model and subtractive color model.
The additive color model has 3 primary colors including red, green, and blue, also known as the RGB color system. The additive color model is the foundation for all colors represented on the screen. Combining all primary color pairs in the same ratio will produce secondary colors such as cyan, magenta, and yellow, but you need to remember that the more increase the intensity of the 3 primary colors, the colors produced will become brighter and whiter. In other words, we will get a white color if the intensity of the 3 primary colors is increased to the highest (RGB = 255 255 255) and a black color if the 3 primary colors are completely removed (RGB = 0 0 0) (Like when the TV is off, the screen is black).
The subtractive color model, also known as the CMYK (Cyan magnenta, yellow, and key) color system is widely used in the printing industry. Contrary to the principle of color creation of the RGB system, which uses different light intensities of the three primary colors to create colors, the CMYK color system uses the principle of light reflection, objects in nature themselves have no color, but only absorb light from the sun and then reflect back to the human eye with different colors depending on the object (like we see that banana leaves are yellow because they absorb all other colors, except yellow). it reflects back to our eyes). The CMYK model goes from white (for example, a white sheet of paper) if you put red ink in it, the color will be measured (red paper), if you pour all 3 colors in, the paper will become black (black paper), (RGB is black to white).
In short:
- RGB color system: used for projects displayed on web, mobile, electronic screens.
- CMYK color system: used in the field, printing, publishing.
Color Harmony
Combining colors in a harmonious way in the design is the most effective and intuitive way for users' perception. When the colors are chosen appropriately, the user will feel happy and comfortable, otherwise the user will feel disgusted and confused. Color balance is crucial in design because users judge a website by first impression, and color has a huge influence in this. True designers are great colorists.
Monochromatic color scheme
Rely on a single base color (hue) with a variety of shades such as grays (shades), blacks (tones) or whites (tints). This is the easiest color scheme to do because with just one color you can hardly create mistakes or annoying designs.
Analogous color scheme
To create a similar palette, you need to choose colors that are next to each other on the color wheel. This color scheme is applied when there is no need to create contrast, including the background, banners.
Complementary color scheme
Symmetrical palettes consist of pairs of colors that are directly opposite each other on the color wheel (like red versus green). This color scheme is the opposite of the similar color scheme above, as it is geared towards creating high contrast. As an example in this image, it's hard to miss the orange button on the blue background.
Split-Complementary (Split-Complementary)
The color scheme is similar to the above, but you can choose to add more colors to your palette. For example, if you choose a blue color, you will get two more colors next to its direct symmetry colors red and yellow (not orange like the one above). The purpose of this palette is to help reduce contrast compared to direct dithering but at the same time use more colors.
Triadic color scheme
When your design needs more color, you can try this color scheme. Take the three colors that lie on the color wheel, so that these three colors form an equilateral triangle. To keep a balance in your design when using this color scheme, you should choose one dominant color and the other two as accents. (accents)
Rectangular or Direct Symmetrical Pairing (Tetradic / Double-Complementary)
The most complex of the 6 color schemes, only for experienced designers because it is difficult to create a balance. Mix: Choose four colors - two pairs of colors that are directly symmetrical on the circle. Connecting four points on each selected color, we get a rectangle. It is very difficult to create harmony using this combination, but if you do, the rewards will not be bad at all.
Conclude
Theory of color is a complex scientific subject that requires a lot of time to learn. However, mastering the basics of color helps us to create effective designs with the subjects we are working on.
Reality proves that, color can help express your ideas without words or sentences. In order for color to work to its fullest effect, the art of color mixing becomes one of the most important techniques. This article will help you know how to mix colors in print and design in the most professional way.
Some concepts you need to know
The color, in addition to its beauty, also has a hidden depth, that miracle has moved people's hearts. Of course, colors are not always beautiful, colors are not always harmonious. Therefore, the art of color schemes in print will compensate for these shortcomings.
The art of positive color schemes
This color is generated from a light source. For example: When the primary colors: Red, green and blue combine to create white.
What should be paid attention to when mixing negative colors in the design?
A negative color is a color determined by the absorption of light. For example, when green, red and yellow are combined, it creates a dark brown color.
If you mix primary positive colors, you will get the opposite basic warm colors. Understanding this opposing relationship in color will identify and correct color problems.
The color wheel
The basic eyebrow circle has 12 arcs divided evenly in the shape of a fan on the area of the circle, each arc will have 8 color levels that gradually go into the center of the circle from dark to light. 12 arcs x 8 levels will create 106 primary colors and are numbered from 1 to 106 which is also the symbol when we choose a color.
For example: Number 1 is the darkest red (C:0 – M:100 – Y:100 – K:45) number 36 is bright yellow (C:0 – M:0 – Y:100 – K:0) ) number 84 (C:80 – M:100 – Y:0 – K:0) is purple rice wine, number 68 (C:100 – M:60 – Y:0 – K:0) is water blue sea.
The base color circle will be created from 3 colors: Red - Yellow - Cyan. From these three colors, the colors will be mixed with two colors (Example: Red + Yellow = Orange) and then three colors mixed together, so we will have more than 3,400 most commonly used colors in the design. graphics and if you keep mixing, mixing and mixing forever, you will have billions of different colors spoiled for you to choose from.
Nowadays, people can easily come across all kinds of advertising posters that are hung all over the squares, traffic light poles of crowded streets, etc. But what makes the difference between our posters? you with the opponent's poster? What will make your poster more impressive in the eyes of customers and stand out the most? Let's find out with Print Saving!
Knowing how to mix colors requires knowing how to use colors
You do the following levels:
Level 1 (primary): Use 3 colors (Red - yellow - cyan) to mix different color shades.
Level 2 (Secondary): If we overlap red over yellow, we will get orange, overlapping red on cyan will get purple, overlapping yellow on cyan will get green, etc. Taking two colors on top of each other to create another color as above is called a monochromatic color.
Level 3 (Tertiary): From the three basic colors red - yellow - cyan, we have mixed orange - green - purple. If we stack the colors at the Primary and Secondary levels, we will get the colors at the Tertiary level which are red orange - orange - yellow green - blue - purple blue and red purple.
There is no 'so-called' black, gray or white because white is only the maximum decrease of one of the 12 colors on the other color wheel, whereas gray and black are the maximum increase in hue of the color wheel. the colors above.
Sequence of color schemes in design
You follow these steps:
Step 1: Clearly define the color effect you want to achieve
Step 2: Choose 1 main color characteristic for the theme you want to show
Step 3: Choose a support color for the main color. To quickly find a supporting color, use two colors that are opposite each other in the base color wheel.
For example: If Red is selected as the primary color, then the color that supports it is green. Similarly, we have the following pairs of primary and supporting colors:
Crab brick color – bottle green
Orange - blue
Turmeric – indigo
Yellow – purple
Yellow green – red purple…
Primary and secondary colors feature enhanced vibrancy and fluidity and help each other stand out.
For example: If you put yellow petals on a purple background, the yellow flowers will be more vibrant thanks to the purple color as the background. But in the same way, using a white or green background will not make the yellow petals stand out. If you put the magenta array next to the green, the same effect will be achieved.
Step 4: From the main color and the color combination, choose a 3rd color that is in harmony with the previous 2 colors.