STILL UNDER CONSTRUCTION the code is working but the NPM module is not, follow instructions here to import the code directly ... and if someone could help to create the NPM module, it would be awesome, I am new to this.

A color picker widget for Netlify CMS that supports HEX color codes, alpha channels via RGBA, color names and custom values.

-> check out the demo here

As an npm package:

npm install --save netlify-cms-widget-colorpicker

import ColorControl from "netlify-cms-widget-colorpicker"; CMS.registerWidget("color", ColorControl);

Via script tag:

<script src="https://unpkg.com/netlify-cms-widget-color@^0.1.0"></script> <script> CMS.registerWidget("color", ColorControl); </script>

Add to your Netlify CMS configuration:

fields: - { name: <fieldname>, label: <fieldlabel>, widget: color }

The default color picker is the "chrome picker", you can change it via the options

fields: - { name: <fieldname>, label: <fieldlabel>, widget: color, picker: github }

The following options are available:

block chrome circle compact github sketch swatches twitter 

For help with this widget, open an issue

Fork the repo, pull the code to your local computer and install dependencies:

npm install

To run a copy of Netlify CMS with the widget loaded for development, use the start script:

npm start

MIT Licensed. Copyright Felix Böttcher

Based on the awesome react-color