Customizable and Touch-Friendly jQuery Color Picker Plugin - spectrum

spectrum is a powerful and high customizable Color Picker Plugin built with jQuery, no Flash and images required. It is easy to skin and customize the plugin with CSS, and there are a wide range of modes and options to explore. It is also touch-friendly that can work well on iOS and Android.

You might also like:

• Beautiful jQuery Color Picker For Bootstrap - Pick-a-Color
• Smooth Color Picker Plugin with jQuery and Bootstrap - jqolor
• jQuery Color Picker Plugin - wColorPicker
• Simple Color Picker Plugin - colorselector
• Colorpicker Plugin For Bootstrap

Basic Usage:

1. Include jQuery library and spectrum.js on your page

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="spectrum.js"></script>

2. Include needed CSS file

<link href="spectrum.css" rel="stylesheet" type="text/css">

3. Markup

<input type='color' class='basic' value='#f594d0' />

4. Options example

$("#picker").spectrum({
    color: tinycolor,
    flat: bool,
    showInput: bool,
    showInitial: bool,
    showAlpha: bool,
    disabled: bool,
    localStorageKey: string,
    showPalette: bool,
    showPaletteOnly: bool,
    showSelectionPalette: bool,
    clickoutFiresChange: bool,
    cancelText: string,
    chooseText: string,
    className: string,
    preferredFormat: string,
    maxSelectionSize: int,
    palette: [[string]],
    selectionPalette: [string]
});

Change Log:

v1.8 (2016-03-28)

• update

v1.3.4 (2014-04-08)

• update

v1.3.1 (2014-02-14)

• bugs fixed.

v1.1.2 (2013-11-12)

• Fixed jslint error, fixed failing tests, fixed missing updateBordersCall

v1.1.0 (2013-04-21)

• Update to the latest version

---

This awesome jQuery plugin is developed by bgrins. For more Advanced Usages, please check the demo page or visit the official website.