Color Palatte Block For WordPress Gutenberg

We are gearing up for upcoming changes to WordPress and as a part of it we have been playing around with Gutenberg.  We are in process of planning migration of some of the old client website & our own properties to Gutenberg. Currently, we are using Gutenberg on our own internal portal for quickly documenting  & sharing project specific details.

In all this, we have identified our needs for some custom blocks of which some are under development. Of them all, one block we wished was to quickly create and share color palettes right from the Gutenberg. The initial version of the block is ready and we are pleased to share that.

Currently, block allows to quickly create color palette by adding colors & option to remove them. Collection of colors is displayed in Polaroid/cards style. This is just the initial release  and we have our wishlist of features which are:

Wishlist:

  • Different display styles
  • Drag and drop arrange colors
  • Edit existing colors
  • One-click copy to clipboard
  • Different color formats

Quick demo of block:

Want to play around with block head over to our Gutenberg playground https://gutenberg.lubus.in/

Block is available for download on WordPress plugin repo https://wordpress.org/plugins/color-palette-block/

Want to dive into the code and explore how it works? the code is opensourced on GitHub https://github.com/lubusIN/color-palette-block

Stay tuned for more Gutenberg goodies 🙂