5 simple rules of using color in UI/UX design
Color is the pivotal tool of a UI/UX design of any software product. It’s one of the most basic, yet one of the hardest things a designer works with. The right color palette can transform a product into a highly-popular, easily-recognizable platform, while the wrong one can turn users away and negatively impact the brand’s success. Finding a perfect color scheme for a particular product not only takes time, but also requires designer’s knowledge, skills and professionalism. There are many theories about how colors affect people’s perception, up to boosting the desire to make a purchase or prompting to order food by awakening the appetite. It might not be easy to apply all these theories, but a good UI/UX designer should surely stick to common rules when choosing a color scheme for a product. Let’s discuss the most important of them.
Color palette should correspond to the product’s brand
When creating a software product it’s important to keep in mind that it is designed to represent its brand rather than exist on its own. Thus, the color palette of a product should correspond to the one of its brand. For example, if the brand’s logo is done in red and white colors, it’s logical to do it’s app or website in a red and white color scheme as well (or colors close in hue). Don’t choose colors that are clearly opposite to the brand’s palette, as it’s not only illogical, but will also make users not associate the software product with the brand at all.
Colors should harmonize with each other
It may seem that this rule needs no explanation, but still the market is overfilled with software products that have “eyes-burning” palettes of colors that absolutely don’t match each other. Harmonious scheme is a guarantee of visual comfort for users. The task to build a harmonious palette is not an easy one — you can start with a monochromatic scheme and then match different colors with each other until you find a perfect combination.
Don’t use more than three colors
Limitation of colors is necessary in order to keep the software product neat, since you wouldn’t want it to look gaudy. The optimal number of colors to use is three: it keeps the product visually interesting while not distracting users attention with too much variety. Keep in mind that these colors should not be too contrasting with each other.
Apply the “60/30/10” rule
60/30/10 is a UI design-related rule that helps organize colors in a product. The rule states that the color palette of a product should have a dominant, secondary and accent color. They should be used in 60%, 30% and 10% respectively. Сompliance with these proportions helps keep the product both colorful and neat, using each color for its purpose. The dominant color is usually used for background and general elements, the secondary one — for smaller elements, the accent one — for elements that need to be highlighted, like action buttons.
Be consistent when using colors
Once you’ve determined the colors according to the 60/30/10 rule, stick to their categories and be consistent with their usage. For example, if you are using pink color as the accent one and highlight the “Order” button with it, don’t use the same color for the background on the other page of the product. Using the same color for different purposes can confuse users and make the product look messy.
