Best jQuery Color Picker Plugins & Tutorials with Demo

Iro.js : HSV color picker widget for JavaScript

Iro.js : HSV color picker widget for JavaScript

Iro.js is a HSV color picker widget for JavaScript with a modern, SVG-based user interface.

Features:

  • Simple: Low friction API, with robust support for hex, rgb, hsl and hsv color formats.
  • Extendable: Tweak the library to your requirements with Plugins and custom UI elements
  • Consistent behaviour: Works across all modern browsers and devices, including touchscreens.
  • Small footprint: 7kb minified and gzipped, with absolutely no jQuery or extra css/images in sight.
  • Great design: The controls are designed to be intuitive and responsive, plus they’re built with SVG so they look super crisp at any resolution.
  • Transparency support: Optional transparency slider with the transparency plugin.

Grapick : Easy configurable Gradient Picker

Grapick : Easy configurable Gradient Picker

Grapick is a easy configurable gradient picker, with no dependencies.

Pickr : Flat, Simple, Hackable Color-Picker

Pickr : Flat, Simple, Hackable Color-Picker

Pickr is a flat, simple, responsive and hackable color-picker. It has no dependencies and compatible with all CSS Frameworks just like Bootstrap, Materialize.

Features

  • Simple usage
  • No dependencies
  • Multiple color representations
  • Color comparison
  • Opacity control
  • Supports touch devices
  • Nodejs support
  • Lightweight, 8KB gzipped

Huebee : JavaScript One-click color picker

Huebee : JavaScript One-click color picker

Huebee is a JavaScript library for creating user-centric color pickers. Huebee displays a limited set of colors so users view all colors at a glance, make clear decisions, and select a color with a single click.

Color Picker plugin in pure JavaScript

Color Picker plugin in pure JavaScript

A simple color picker plugin in pure JavaScript, for modern browsers.

Colorpanel : jQuery CSS File Switcher

Colorpanel : jQuery CSS File Switcher

Simple jQuery plugin to switch css stylesheet skin theme on your template demo.

jQuery Palette Color Picker

jQuery Palette Color Picker

JS component to pick colors from a predefined / restricted palette.The name attribute is used to bind the color picker to the input, so its recommended to be unique if you have several inputs with the same name, all of them will change simultaneously when user picks a color.

Colorbrewer : jQuery Bootstrap Colour Picker

Colorbrewer : jQuery Bootstrap Colour Picker

A simple bootstrap colour picker utilising the colorbrewer scales.

dynamicColorPage : jQuery Plugin to Change Color of Your Page

dynamicColorPage : jQuery Plugin to Change Color of Your Page

dynamicColorChange is a small jQuery plugin to give your users the opportunity to style your page as they want. All you have to do, is, to define a couple of selectable colors and include a button with the class “color_changer-toggle” to toggle the color changer.

Bootstrap Colorpicker Plus : jQuery Plugin

Bootstrap Colorpicker Plus : jQuery Plugin

A Twitter Bootstrap component basically adds a color picker to a field or any other element, even embed to the page or dropdown menu.

  • common color panel
  • custom your favor color
  • the bootstrap-colorpicker integrated