How to easily find darker and lighter shades of a hex color code

How to easily find darker and lighter shades of a hex color code

Quick post here for a utility I find myself using quite a bit: When doing web design you will inevitably come to a situation where you want to take a look at several different shades of a base hexadecimal color code. Say for example, you’re working on a clients site, and their company color is a specific shade of blue (#7847FF for example), and you want to get a darker shade of that exact blue. is a very useful website that will help you accomlpish just that. Visit and plug in your hex color code, you will then be presented with a list of a bunch of darker and lighter shades of that same color. You can also view other tones and palletes revolving around that same hex color. Clicking on a new color will automatically copy the new hex code to your clipboard.

I should mention that there are several other sites that will perform this for you, but I’ve had success using in the past, and it’s served my needs well, so I stick with it.

Hopefully you can get some use of this handy website. Thanks to!

By | 2018-04-01T02:04:00+00:00 December 27th, 2012|Categories: Handy Tools/Utilities, Web Design|3 Comments

About the Author:


  1. Ashish Kalmegh September 16, 2014 at 2:13 am - Reply

    This was really helpful. Thanks for sharing

    • Brent September 17, 2014 at 4:36 pm - Reply

      You’re welcome, glad you found it useful!

  2. nikolo matutina September 3, 2015 at 3:03 pm - Reply

    You can also use – simple tool that generate lighter and darker shades of color. Useful for design ideas. Non flash

Leave A Comment