Using Material colors and other palettes

2019-02-16
Python Colors Design



Choosing between colors is always a difficult task, especially for people like me who are not very good a design tasks.

I used to have a hard time every time I had to deal with colors. I allways felt that having a lot of names for the colors was not a practical solution. For example in html you can use colors like darksalmon, mediumvioletred or darkslateblue which I find almost impossible to remeber and work with.

But in 2014 google presented Material Design and a very good color palette.

Table of Contents

1. Material design palette

There are 19 colors with 10 different intensities for each one plus the white and black colors. This gives us 192 different colors ordered in a matrix.

material_colors

This allows us to use gradients of the same colors like in the following plot:

More info about colors and palettes can be found at htmlcolorcodes.com.

2. Using material colors in python (v-palette)

I use plotly in a lot of projects and I like using the material colors as well.

To do so I create a simple module (v-palette) that allows me to call the colors I want to use with an array of color names and indexs. For example:

from v_palette import get_colors

# Retrive one color
get_colors(("red", 100))
Out: '#FFCDD2'
# Retrive some colors
get_colors([("red", 100), ("blue", 100)])
Out: ['#FFCDD2', '#BBDEFB']

Remeber to install it using pip with:

pip install v-palette

2.1. Flat colors

If you use v-palette you can also use the flat colors.

flat_colors

You can use them by passing the param palette="flat"

# Retrive some colors
get_colors([("emerald", 100), ("silver", 100)], palette="flat")
Out: ['#D5F5E3', '#F2F3F4']

# Example plot with colors