JavaScript / HTML Color Picker component (Color palette / selector)

jscolor is a web color picker component that aims to be super easy both for developers to install and for the end users to use.

Explore the two-liner example below and see how easy the installation can be…

Installation in two lines

<script src="jscolor.js"></script>

Color: <input class="jscolor" value="ab2567">
Color:
Download jscolor including this example | Explore more examples »

Example app

This is a demo application
built using jscolor
RGB
HEX
H °
S %
V %
R
G
B
RGB
HEX
° H
% S
% V
R
G
B

No framework needed

jscolor is a completely self-sufficient JavaScript library consisting of only one JS file. It doesn't need any frameworks (jQuery, Dojo, MooTools etc.) but it can certainly coexist with them.

Cross-browser

All modern browsers are supported, including:

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

Highly customizable

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

Touch-friendly

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

Need assistance with implementation?

Should you need any assistance implementing jscolor in your project/website, the author provides a web development and consultancy service (subject to time availability).

Typical scenarios solved are AJAX integration, page interaction on color change, building user interfaces around jscolor, sending chosen colors to a server-side script, color replacement, etc.

  • Process:

    Client describes their idea and provides corresponding webpage(s) or their link, if needed. The work is estimated and, upon mutual agreement, the result is emailed back to the client within a few hours/days according to the complexity of the task.
  • Charge:

    $60 / hour. Quick advice comes free.
    The majority of tasks require only a few hours of work. For student/nonprofit projects, an individual fee can be arranged.
  • Contact:

    Please email for assistance. It is helpful to briefly describe your idea and if possible, provide a link/screenshot of your project, so that we can estimate the amount of work involved.

Testimonials

Great work! Searching the web I found your picker very elegant and easy to use.
— Aleksandar
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
I really like jscolor, it's perfect for my little free web app!
— Alan