This following HSLa tool is genius as unlike all similar tools I encountered, not only it gives you a brightness hierarchy (y axis), but also a hue variant (x-axis) hierarchy. I went through some tools and it's the only straight-forward tool I found that does both.

The problem with that tool is that it doesn't let you paste colors into it... As you could see immediately, It shows only one color set...

Do you know an exactly similar software that actually gives you to paste colors?

To emphasize, I don't mean to a simple HSL tool, but for an HSLa tool that offers both brightness and hue variants on the 2 axles (y=brightness, x=hue):

enter image description here

Note: This tool is open source. If there is a veteran JS programmer who would like to create a similar tool that allows pasting, it can be a great contribution to the Open source community.

  • Can you give an example of what you would paste? Which types of color formats (hex, HSLa, etc.) would you want to paste?
    – Tom
    Sep 14, 2016 at 22:53
  • I usually use hex colors but I warmly recommend giving all options.
    – user12301
    Sep 14, 2016 at 23:56

3 Answers 3



Alright, I liked the HSLa tool you gave as well:), so why reinvent the wheel? Yep, it's the same tool with just a bit more functionality that you're looking for. Some cool features:

  • You can copy and paste the following colors:

    • Hex
    • RGB
    • RGBA
    • HSL
    • HSLA
    • HSV

      *obviously only some of those support transparency

  • Open source under the GNU v3 License

Need something else? Ask away.

It can be launched here and the repo for the code is here.


Please let me know if this is what your looking for:)

  • 2
    Indeed, Also modifying the tool is just great !. I personally thank you dearly for that Tom. Loved giving the bounty to you!
    – user12301
    Sep 16, 2016 at 2:25
  • 1
    @Benia Great to hear, thank you. Again, if you need something tweaked, let me know:)
    – Tom
    Sep 16, 2016 at 2:34
  • 1
    Added small note about the lessermost, leftest colorbox in Github.
    – user12301
    Sep 16, 2016 at 2:37
  • 1
    @Benia Should be fixed, please let me know
    – Tom
    Sep 16, 2016 at 3:06

I'm not certain, but check out this one: http://hslpicker.com/

It's open source, and you can paste the HSLA color code into it. I'm not entirely sure, but it's possible you can also dump the HSLA color codes into the URL somehow - while playing around with the sliders, the URL jumped to the following: http://hslpicker.com/#8a0000/#0091ff,0.92

Hope this helps! (And if not, please specify why not) :)

  • 1
    It doesn't help since this tool doesn't allow x-y hierarchies as described.
    – user12301
    Sep 15, 2016 at 14:03
  • Since the layout of the application you're looking for is so specific, I'm afraid this will have to be a custom job. Have you tried getting in touch with the author of the HSLa tool author, Chris Coyier? Since the tool I linked was also featured on his page (link) (oops), and it's also Open Source, perhaps he can help? Sep 15, 2016 at 14:49

Try hsla.online

I find it pretty easy to use. There is a input field to paste an hsla code and it seems to meet your requirements.

enter image description here

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.