Image Color Palette for Gutenberg

Description

This plugin provides a simple utility to generate a color palette based on the dominant colors of an image. The colors can be copied to the clipboard and pasted in a color picker.
It also creates color schemes based on the image colors.

Usage

Go to any post editor where the new Gutenberg editor is enabled.
Inside the Post editor on the right side of the top Toolbar the plugin icon/button should appear (if not, please read the FAQ below).
Click the icon/button to open the plugin sidebar.
Click the main button and the Media Library will open. Select an image and click the Select button.
A color palette will be created based on the colors of the image.
Click on any of the colors and a menu will appear.
The color can be copied to the clipboard (in HEX format) and pasted in the color picker of any block.
For supported blocks, the menu will display extra options to apply the color directly to the Block attributes.

Credits

Banner image belongs to Simone Hutsch.

Screenshots

  • Example use of palette generated colors.
  • Scheme select list.

Installation

Installation from the WordPress admin.

  1. Log in to the WordPress admin and navigate to Plugins > Add New.
  2. Type “Image Color Palette” in the Search field.
  3. In the results list Image Color Palette plugin should appear, click Install Now button.
  4. Once it finished installing, click the Activate button.
  5. That’s it, now you can go to any post where Gutenberg is enabled and start using the plugin.

FAQ

I do not see the plugin icon in the post editor

Alternatively the Plugin can be opened from the Show More button (the 3 dots on the right side of the Editor Top Bar).
Click the More button and inside the menu list click on the plugin name “Image Color Palette”.

Reviews

Read all 1 review

Contributors & Developers

“Image Color Palette for Gutenberg” is open source software. The following people have contributed to this plugin.

Contributors

“Image Color Palette for Gutenberg” has been translated into 1 locale. Thank you to the translators for their contributions.

Translate “Image Color Palette for Gutenberg” into your language.

Interested in development?

Browse the code, check out the SVN repository, or subscribe to the development log by RSS.

Changelog

1.3.1

  • Fixed block selected before plugin sidebar is open not passing attribute options to color menu.

1.3.0

  • Added new feature to paste the color automatically to the selected block color attribute (currently available for core blocks)
  • Added new popover menu when clicking on a color
  • Small fixes

1.2.0

  • Improved code base and interface
  • Organized UI in two tabs: Palette & Settings
  • The scheme can now be toggled directly from the Palette

1.1.0

  • Improved UX with better debouncing and better performance in color palette generation
  • Moved copied_color and copied_index out of store
  • Reorganized JavaScript components

1.0.0

  • Initial release.