Colormind Creates Color Palettes Using Artificial Intelligence

It surely is not the first application case that comes to mind when you think about it. Nonetheless, the automatic creation of color palettes via "Deep Learning" definitely makes sense.

Colormind: AI-Experiment With Practical Use

Jack Qiao from Vancouver, Canada neither calls himself a designer, nor an engineer, even though he works in both areas. Jack doesn't like to be tied down, and always tries to work on things that he is interested in. In the developer community, he already gained some popularity with his JavaScript tool SVGnest.

His most recent project Colormind.io deals with the question how you could use artificial intelligence for the creation of harmonious color palettes. Jack's primary thought was that in the end, even quite experienced designers tend to create color palettes based on personal taste for the most part. He looked for a more scientific method to reduce the human factor a bit more and to produce more objectifiable results.

Thus, he used the technique of "deep learning" which is basically always meant when talking about AI. If you are interested in a newer, more differentiated definition, you should read my article at t3n (German), which goes more into detail explaining the differences.

"Deep learning" is a method of machine learning that's very similar to the human brain's way of working. Using neuronal webs, the engine allows itself to recognize structures, evaluating this recognition, and continuously improving itself in multiple iterations. This way, it improves its results on its own, constantly learning.

For the application case of generating color palettes, Jack fed his AI palettes from Adobe Color, as well as best practices from Dribbble. The achieved results still require human judgment, but they are a mostly objectified basis for further work.

Colormind: How to Generate Color Palettes With the AI-Tool

The creation of harmonious color palettes becomes easy using Colormind. On the project's landing page, you see a broad color palette directly below the main navigation. Colormind always starts with a suggestion. Generate a new one by clicking the "Generate" button on the bottom left of the palette.

However, this approach will only be modestly expedient. It's better to choose a starting color, using the button with the sliders below the first palette field. A color picker opens, which can either be used to visually select a color value or by entering the desired color's hex value.

After the color selection, this color will be displayed in the first palette field. If it's a color that has to be in your palette, in any case, fix it permanently with a click on the lock symbol. Now, click on "generate" again, and Colormind adjusts the other color values to your initial selection.

[caption id="attachment_82437" align="alignnone" width="640"] User controls can be found under the color palette's fields. (Screenshot: Noupe)[/caption]

The color's position in the palette makes a difference. If you want the selected color to be a part of, but not the starting point of your palette, use the arrow icons below each field to move it to a different position simply, and generate a new palette.

Colormind is also able to create color palettes from images. To do so, just upload your image via the button "upload," and click "generate." Here is where Colormind works flexibly. If you click on "generate" multiple times, your results will vary to an extent. No matter what the generator makes sure that all results work well as a palette.

[caption id="attachment_82436" align="alignnone" width="640"] Images With Extracted Color Palettes. (Screenshot: Noupe)[/caption]

If you are highly interested in the functionalities behind Jack's AI usage, you should read both of his blog posts, which explain the algorithm itself, as well as the approach when it comes to images.

Featured Image by  Werner Weisser on Pixabay