What is jscolor?

jscolor is JavaScript component extending standard form controls of the smooth color picker dialog. All you need to pickerize your text fields (like below one) is to include script jscolor.js into your HTML page and turn all related <input> elements into <input class="color">

Example

Click here to see jscolor picker in action: More examples…

Cross-browser compatibility

BrowserStatus
Internet Explorer 5.01 SP2 / Winsupported
Internet Explorer 5.5 SP2 / Winsupported
Internet Explorer 6 / Winsupported
Internet Explorer 7 / Winsupported
Opera 9.01 / Winsupported
Firefox 2 / Winsupported
Firefox 2 / Linuxsupported
SeaMonkey 1.0.5 / Linuxsupported
Konqueror 3.5.4 / Linuxsupported

If you are using browser not mentioned here, it would be really helpful to test jscolor's behavior and write me whether it works in your browser or not.

Author & License

jscolor project is maintained by Honza Odvarko and released under the GNU General Public License. You can repay my work e.g. reporting the bugs you have found or telling me what to improve in jscolor :-)

Download

Latest release is jscolor-1.1.0.zip

Installation

  1. include script jscolor/jscolor.js
  2. turn all related <input> elements into <input class="color">

News

  • 2008-10-26 I'm proud to announce new, completely rewritten jscolor-1.1.0. Color picker is now much more customizable and widely accessible via API. Enjoy!

Examples

  1. Basic usage
  2. Tweaking
  3. Picker modes (HSV/HVS)
  4. Customizing picker sizes
  5. Customizing picker colors
  6. Onchange event
  7. Getting color
  8. Setting color

Tags

javascript java script js dhtml dynamic html compact simple small smooth interactive rgb hsv hex color colour pick picker colorpicker palette pallet spectrum select selection selector getter generator form forms input field dropdown popup pop-up context dialog panel window box control plugin module component extension widget tool toolkit applet library framework pack package