Minimalist Color Picker Plugin For jQuery - fastColorPicker

A simple, lightweight, fast jQuery color picker plugin which allows the user to select colors form a predefined palette popup.

How to use it:

1. Include the core CSS file jquery.fastColorPicker.css in the head section of the webpage.

<link rel="stylesheet" href="jquery.fastColorPicker.css">

2. Create a DIV container in which you want to place the color picker.

<div id='my-color-select'></div>

3. Include jQuery library (Slim build) and the jquery.fastColorPicker.js at the bottom of the webpage.

<script src="//code.jquery.com/jquery-3.1.0.slim.min.js"></script>
<script src='jquery.fastColorPicker.js'></script>

4. Define an array of colors in the JavaScript.

let colorArray=['#3f51b5','#ffffff','#ffa500',...];

5. Initialize the color picker as this:

$('#my-color-select').fastColorPicker(colorArray);

6. Default plugin options. You can pass the following options as the second parameter to the fastColorPicker:

$('#my-color-select').fastColorPicker(colorArray,{

  // color picker
  box:{
    width:'default',
    height:'default',
  },

  // color blocks
  item:{
    width:'default',
    height:'default',
    hover:'true',
  },

  // buttons
  btn:{
    width:'default',
    height:'default',
  }
  
});

Change log:

2016-09-20

• bugfix.

---

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