ngjs-color-picker

A small directive which essentially is a color picker but with a few extra functions - for AngularJS. Based on ng-color-picker.

Requirements: Angular 1.2+

Features

• Customize the appearance of the color picker (vertical, horizontal, columns etc.)
• Generate random colors
• Generate gradient colors

Demo

• Demo
• Plunker

Installation

npm:

npm install --save ngjs-color-picker

You may have to run

grunt wiredep

to make grunt automatically add the needed files to your index.html.

Manually:

Clone or download the repository and include the production file in your application.

<script type="text/javascript" src="dist/ngjs-color-picker.js"></script>

Inject the directive as a dependency in your app:

angular.module('myApp', ['ngjsColorPicker']);

Usage and documentation

For documentation, examples and usage see the GitHub page for this repository.

Option prioritization

1. Custom colors
2. Random colors
3. Gradient
4. Default colors

Contribute 🙌

Run npm install and then you're able to start dev server with

npm run serve

The server is then available at http://localhost:8080.

The file dev/app/ngjs-color-picker.js is a symlink to source/ngjs-color-picker.js, so you can edit either one of them and the change will be shown on the dev server.

(Development server environment created using awesome angular-webpack).

TODO

• See issues
• Click (or something) to get the hex-code for the color (rgb should also be available)
• Add reverse option for gradient
• Include color themes (Good palettes: http://jsfiddle.net/nicgirault/bqph3pkL/)
• Add option to select rows instead of columns