Setting The Color Palette For a Digital Product

Eliezer Pujols
NYC Design
Published in
2 min readOct 18, 2018
Photo from Pexels.com

Set a good color palette for a digital product is not only an important task in the design process but also where designers spend a lot of time.

There are some design principles, such as legibility, contrast, harmony, among others, that we should keep in mind to get better results. For that reason, I wanna give you three simple tips that always help me to start setting quickly the color palette of a digital product.

Brand color

The first step is to start choosing two or three colors from the brand guidelines. These colors should define the product and make the target audience feel comfortable and identified. But if the product doesn’t yet have a brand then create it, because it’s essential to get better results.

Example 01

Color of states

Sometimes the brand color is not the best for important states, such as error, success, alert, among others. So detach yourself from the color brand and start defining the color of states for the product.

Example 02

Grayscale

Define a grayscale will help you to establish a good hierarchy in your content, in other words, it will mark the difference between headings, subtitles, borders, backgrounds, etc.

Example 03

Result

Let’s put everything together. Figma File: bit.ly/2ElGF9U

Thank you for reading! I hope you find it useful.

--

--

Eliezer Pujols
NYC Design

A designer who is passionate about crafting meaningful experiences. Currently designing at Scotiabank.