A repository of over 1000 quality jQuery plugins

jQuery Angular Pick A Color

Angular Pick A Color is a jQuery Color Pickers plugin.

Created by Cdjackson

Provides an angular directive for the excellent ‘pick-a-color’ jquery color picker plugin.

Not what you're looking for? Click here to view more Color Pickers jQuery plugins


AngularJS directive for the pick-a-color JQuery plugin.


Installation: Install with bower:

bower install angular-pick-a-color --save

This should grab all the dependancies. Alternatively, download the files from this repo (angular-pick-a-color.js) and also grab the js file and css from the pick-a-color repo…

Then, in your index file, you need to add the following lines -:

(obviously change the folder names and the pick-a-color css file might have a version number - take a look at the pick-a-color site).

Usage: Include the 'pickAColor' module in your application and use the following directive in your html. pick-a-color options can be placed in the definition as shown below.

<pick-a-color id="inputColor" ng-model="color" inline-dropdown="true"></pick-a-color>

To set default options, you can use the configuration provider in your apps config method -:

.config(function myAppConfig(pickAColorProvider) {
        inlineDropdown: true

You might also like these other Color Pickers jQuery Plugins

  • colorpicker

    evol.colorpicker is a web color picker which looks like the one in Microsoft Office 2010. It can be used inline […]

  • Color Thief

    Grabs the dominant color or a representative color palette from an image. Uses javascript and canvas.

  • TinyColorPicker

    Tiny jQuery color picker for mobile and desktop with alpha channel