I stumbled upon this frankly excellent, though unfortunately generically named, jQuery color picker plugin the other day. Color Picker is a jquery plugin developed by Stefan Petre, which simply put, delivers you with a neat little widget that allows a user to select a color the same way you would select a color in a graphics application like say Adobe Photoshop.
It is particularly simple, provides you with a number of configurable options as well as layouts to choose from. Listed as its main features, Color Picker exhibits a great flat mode (in other words can appear as an element in the page), power controls for color selection, easy customization (swapping in and out base images) and can fit nicely in the standard viewport.
It is dual licensed under MIT and GPL in case you were wondering.
Implementing is as simple as including the stylesheet and javascript file in your header and then instantiating the plugin in the usual way:
$('input').ColorPicker(options);
where the options is a standard hash of optional paramters. These options include:
- eventName: The desired event to trigger the colorpicker. Default: ‘click’
- color: The default color. String for hex color or hash for RGB and HSB ({r:255, r:0, b:0}) . Default: ‘ff0000’
- flat: Whatever if the color picker is appended to the element or triggered by an event. Default false
- livePreview: Whatever if the color values are filled in the fields while changing values on selector or a field. If false it may improve speed. Default true
- onShow: Callback function triggered when the color picker is shown
- onBeforeShow: Callback function triggered before the color picker is shown
- onHide: Callback function triggered when the color picker is hidden
- onChange: Callback function triggered when the color is changed
- onSubmit: Callback function triggered when the color it is chosen
So in other words, easy to implement, loads of customizable features and works like a charm!
Related Link: http://www.eyecon.ro/colorpicker/