Create a Material Color Palette in NO time

If you’re familiar with the new theme setup in Android since AppCompat v21, you’ll need to define 3 colors from the start. That being your colorPrimary, colorPrimaryDark and accent. However I’m pretty sure JUST those 3 isn’t enough for your robust app and to add to it, deciding on colors and how it would look is no ordinary feat (at least for me).

There are a lot of online resources that give us a visual palette to pick from. I’ll point you to one that gets the work done in just 2 clicks!

Google’s Material Color Palette

google material color palette

Personally, this is where I’d go ALWAYS, to find myself some material colors. They have an exhaustive list of all the Material Design colors, complete with darker tones and accents.

Copy pasting the HEX codes into my projects as and when required seemed intuitive at the time. They even let you download the entire color swatches as a zip.

materialpalette.com

materialpalette

If you’ve never come across this website, then let’s just say that, I’d literally force you to use this instead. Why, you ask?

Primarily because, in just two clicks, you’ve got yourself an entire color palette ready for your theme, along with a preview!

It’s created by the same guy who runs MaterialUp, Matt Aussaguel.

You first pick your primary color and then your secondary. That’s all you have to do. Sit back and watch the website generate a complete robust palette inclusive of your darker primary tone, text colors and lighter accent tone complete with a neat interactive preview on top.

They make it even more convenient by allowing you to download it in different formats like XML, CSS, SASS, LESS, etc.

If it’s for your app, you can download the XML file and use it in your app. It works right out of the box!

Highlights:
  • Simplified palette only showing color primaries
  • Choosing a primary and accent color is the only effort on your part
  • Generates a complete, robust palette
  • Live preview of the palette in use
  • Readily downloadable in various formats
  • Single click to copy color HEX code

Ever since I’ve come across this website, it has been my go to place for some Material Design colors. You should give it a shot too!


Know of something better? Drop ’em in the comments below.

Suleiman

Product Designer who occasionally writes code.

You may also like...

Leave a Reply

Your email address will not be published. Required fields are marked *