jscolor.js is a JavaScript color picker with opacity channel

Just add data-jscolor attribute…

No framework needed

jscolor.js is a self-sufficient JavaScript library consisting of only one file of plain JavaScript.

It doesn't need any frameworks (jQuery, Dojo, MooTools, etc.)
but it is friends with them all.


All modern browsers are supported, including:

Edge, Firefox, Chrome, Safari, Opera, Internet Explorer 10 and above, and others…

Highly customizable

jscolor provides variety of configuration options.

Whether you need to change color picker's size or colors, or attach a function to its onchange event, the configuration can be fine-tuned for your web project.

Mobile friendly

With a built-in support for touch events, jscolor is designed to be easy to use on touch devices such as tablets and smartphones.

Assistance with implementation

Should you need assistance incorporating color-related features into your project, you can email
Brief advice comes free.

Typical scenarios solved:

  • Building color-related user interfaces, e.g. for generating colorized images of prints or product variants
  • Dynamic page layouts based on user-specified colors and other parameters
  • Color space calculations and conversions
  • AJAX integration, server-side processing of color data, etc.

jscolor example

The side buttons have
jscolor installed on them
H °
S %
V %
° H
% S
% V


I just wanted to send a personal thanks for saving me a lot of time and bother. […]
You've provided the cleanest solution with copy/paste of 2 lines and it's running.
— Greg
many thanks for the great work on the color picker tool! I really love it!
— Andre
first I want to thank you for putting such an effort to develop this nice library. I'm very happy that I don't need to add jQuery to my site - thanks to your independent jscolor…
— Jakub