Color Tools

Top 12 Web-Based Color Tools for Web Designers

Picking the perfect color scheme shouldn’t be a miserable task. All you need are the right tools for the job and an eye for design. These tools are all 100% free, so they’re easy to bookmark and reuse time & time again. They can also work for web, mobile, print, or any other medium that needs incredible colors.



download (2)

Recently I was browsing the web and stumbled onto ColorHexa. It’s by far one of the coolest color tools I’ve ever seen.




If you do some research into color psychology you’ll learn how different colors stack together & what sort of mood they give. This plays into contrast for certain types of colors and how they work together.


ColorPick Eyedropper Extension


You can use Chrome DevTools but this requires digging around in the code to pick out the hex colors. Instead, you can use the ColorPick Eyedropper extension made exclusively for Google Chrome.


Screenshot (16)

The Coolors site is a large color scheme generator. You can find dozens of generators on the web, but this one’s a little different since it supports Adobe programs with its own add-on.


Palettte App

download (1)

Palettte is color editing and remapping tool. It allows you to build color schemes that flow from one to another and fine-tune individual color swatches. You can also import, analyze, and editing existing color schemes. The creator has written more on the motivations behind this color app.


Material UI Colors

Screenshot (17)

With a quick Google search, you’ll find a bunch of sweet material design tools on the web. They seem never-ending and many of them rely on the color styles typically found in Android apps.


Color Supply

download (2)

The Color Supply website is pretty unique but also very strange. It gives you a bunch of interesting color tools for matching color schemes, picking the foregrounds & backgrounds, plus different ways to compare how those colors would look on a page.

Color Safe

download (3)

Color Safe is a free web app that can test your color choices. You pick from a small set of fonts & sizes, then pick whatever colors you want for your foreground & background.

Color Hunt

download (4)


For a user-curated gallery of color schemes take a look at Color Hunt.

Open Color

download (5)

Looking for something a little more web-friendly? Then check out the Open Color library.

HTML Color Codes

download (6)

HTML Color Codes is another info-focused color web app.

Adobe Color CC

download (7)

I can’t pass over the incredible Adobe Color CC web app.