Do you wish to implement a color picker in your design applications? Checkout the following free scripts. Some of the well known frameworks used to develop these scripts are JQuery, MooTools and Script.aculo.us.
1. COLOURLovers Color Picker is a free, advanced and professional DHTML script which is easy to implement in the pages of your website.
* Draggable color picker
* multiple fields can be used to call the script
* The script is WYSIWYG – the color you pick is the color you get
* The position of the picker can be set (x, y)
2. ColorPicker is a JQuery simple component that allows you to select color in the same way you select color in Adobe Photoshop.
* flat mode – element in page
* powerful controls for color selection
* easy customizable
* fits into the view port
* This plugin uses layered transparent PNGs to render a saturation/lumination gradient inside a hue circle. Flash and pixel sized DIVs aren’t used.
* It’s WYSIWYG – the color you click is the color you get (with the exception of +1/-1 rounding differences). Many pickers throw up an arbitrary gradient that’s only a poor match.
* The intuitive HSL color space is used rather than the more common HSB – it’s easy to make a color brighter without touching its saturation, or vice versa
* Small size – built on the compact JQuery library having only 23 KB
* Fully CSS Customizable
* Keeps DOM clean and generates valid XHTML and CSS
* Returns an object containing RGB, HSB and HEX of chosen color
* Fast loading
* Works in most modern browsers such as FireFox (and friends), Safari, Opera, IE
5. YUI Color Picker is based on Yahoo’s excellent UI library (slider widget).
* It’s WYSIWYG – the clicked color is the color you get
* multiple text fields can be used to fill colors using a single Color Picker
6. Color Picker was inspired by YUI Color Picker script and it is based on the fantastic script.aculo.us library.
* CSS Customizable
* Easy to install
* It is WYSIWYG
7. NoGray Color Picker is an advanced script that handles RGB, HSL, and Hexadecimal values. It works in the same way as the color picker from Adobe Photoshop returning the hexadecimal value of the color.
* an XHTML doctype
< !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
* The look and feel are customizable (edit color_picker_interface.html)
* Option to use Only Web Colors (Photoshop-Like)
* It’s WYSIWYG
8. jsColor extends standard form controls of a smooth color picker dialog. To pickerize your text fields you just have to include the jscolor.js script into your HTML page and set your input elements to <input class="color"/>.
* it’s quick and easy to install
* it doesn’t use any pop-up windows
* it’s cross-browser compatible
9. colorPicker is a free, simple and easy to use script that add a color picker control to your input fields.
* update the input field’s background with the selected color
* easy & fast installation
[Go to tutorial page]
- February 24, 2009
- article by Gabriel C.
- 4 comments