How I learnt about color theories and made my best color palettes in one month

#7 — Seventh month of my challenge: 12 topics to learn in 12 months

Sandoche ADITTANE
Dec 14, 2017 · 12 min read
Image for post
Image for post
Some colors plates… we will come back to that, don’t worry

Preparation

Color theories

Theory about colors. The Basics

Terminology

Image for post
Image for post
Source: http://interkom.ca/the-world-of-colour-part-iii-taking-a-spin-on-the-colour-wheel/

Color systems

Image for post
Image for post
HSV in space — Source: https://en.wikipedia.org/wiki/HSL_and_HSV
Image for post
Image for post
RGB in space — https://en.wikipedia.org/wiki/RGB_color_model

Meaning of colors

Source: Vox — The surprising pattern behind color names around the world
Image for post
Image for post
Goethe color system’s equilateral triangle

Interaction between colors

Image for post
1 color looks like 2— Source: https://blog.prototypr.io/11-optical-illusions-found-in-visual-design-295e7ae211b9
Image for post
Image for post
The two little squares in the middle of each big rectangles look the same but have different colors, you can see them reverted and next to each other on the bottom of the plate
Image for post
Image for post
The contrast between edges of the slightly differing shades of gray — The Mach bands effect — source: https://en.wikipedia.org/wiki/Mach_bands

Practice. How to build the perfect color palette

Programmatically

Image for post
Image for post
The color wheel — source: https://www.franklinpainting.com/blog/home/choosing-colors-interior-painting/
Image for post
Image for post
Color schemes — source: https://www.shopify.com/retail/119923395-why-all-sale-signs-are-red-the-science-of-color-in-retail

By practicing

Image for post
Image for post
Colors are like ingredients, put them together and see how they react!

Color palette creation process 📋

Useful tools

Let’s build some tools and palettes

The tools

The palettes

Image for post
Image for post
My current portfolio
Image for post
Image for post
Here is Airbnb’s palette from my analysis

The final results

Color palettes

Colors interactor

Image for post
Image for post
Here is a screenshot of Colors Interactor — as you can see it generated different plates including one in grey scale

SASS Colors playground

Feedback from this learning month

What went well

What to improve

If you liked this post, please click the clap 👏button below a few times to show your support! Also, feel free to comment and give any kind of feedback. Don’t forget to follow me!

Learning Lab

How to learn one topic every month

Medium is an open platform where 170 million readers come to find insightful and dynamic thinking. Here, expert and undiscovered voices alike dive into the heart of any topic and bring new ideas to the surface. Learn more

Follow the writers, publications, and topics that matter to you, and you’ll see them on your homepage and in your inbox. Explore

If you have a story to tell, knowledge to share, or a perspective to offer — welcome home. It’s easy and free to post your thinking on any topic. Write on Medium

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store