The color base

The color wheel

The color scheme

Single color is tie-in

As the name suggests, just building the UI with a single primary color, with levels of hue and saturation, is a well-regulated color scheme that doesn’t create an alternative UI.

Adjacent color collocation

Select adjacent colors on the color wheel to match for different contrasting color designs.

Compared with

Choose a color blend on opposite sides of the color wheel. This scheme, as opposed to adjacent and monochrome, aims to produce a high contrast and is used to draw the user’s attention.

Coordinate contrast collocation

This scheme is similar to the previous one, but it uses more colours.

For example, if you choose blue, you need to take the two other colors (yellow and red) adjacent to its opposite.

The contrast here is not as strong as the high contrast scheme, but it allows for multiple colors.

Three color is tie-in

When a design needs more color, try a three-color scheme.

It is based on three different colors equally spaced on a color wheel.

For balance, it is recommended to use one color as the dominant color and another as the auxiliary color.

Four color separation by

The quad color scheme is suitable for experienced designers as it is the most difficult to balance.

It uses four complementary colors of the color wheel.

If the dots on the selected color are joined together, they form a rectangle. This scheme is difficult to balance colors.

The color scheme

1

coolors

2

uigradients

3

uisdc

4 nipponcolors

5

colordrop

6

colorfavs

7

colorhunt

8

materialpalette

9

picular

10

thedayscolor