netlify-cms-widget-colorpicker

0.0.1 • Public • Published

netlify-cms-widget-colorpicker

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

Based on the awesome react-color

-> check out the demo here

Install

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>

How to use

Add to your Netlify CMS configuration:

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

Configuration

The default color picker is the "sketch 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

Support

For help with this widget, open an issue

Development

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

License

MIT Licensed. Copyright Felix Böttcher

Netlify Status

Package Sidebar

Install

npm i netlify-cms-widget-colorpicker@0.0.1

Version

0.0.1

License

MIT

Unpacked Size

165 kB

Total Files

3

Last publish

Collaborators

  • felixboet