Image Color Palette

Descripción

DemoDocumentationGitHub

Image Color Palette provides a simple utility to generate a color palette based on the dominant colors of an image. It also creates color schemes based on the image colors.

The colors can be copied to the clipboard and pasted in a color picker. When a registered block is selected the plugin permits applying the color to certain block attributes like text or background color.

Color schemes

Available schemes include:

  • Analogous
  • Monochromatic
  • Triad
  • Complementary
  • Lighter
  • Brighter
  • Darker
  • Desaturated
  • Saturated

Uso

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.

Agradecimientos

La imagen del Banner pertenece a Simone Hutsch.

Capturas

  • Ejemplo de colores de paleta geenerados.
  • Lista de selección de esquema.

Instalación

Instalación desde el panel de administración de WordPress.

  1. Accede al Panel de administración de WordPress y navega a la sección de Plugins > Añadir nuevo.
  2. Escribe «Image Color Palette» en el Campo de búsqueda.
  3. En la lista de resultados Image Color Palette debería aparecer, haz clic en el botón Instalar ahora.
  4. Una vez haya terminado la instalación, haz clic en el botón de Activar.
  5. Eso es todo, ahora puedes ir a cualquier entrada donde Gutenberg esté activo y comenzar a utilizar el plugin.

FAQ

No veo el icono del plugin en el editor de entradas

Alternativamente el plugin puede ser abierto desde el botón de «Mostrar más» (el icono de 3 puntos a la derecha de la barra superior de Gutenberg).
Haz clic en el botón de «Mostrar más» y dentro del menú selecciona el nombre del plugin «Image Color Palette».

Reseñas

Leer la 1 reseña

Colaboradores y desarrolladores

«Image Color Palette» es un software de código abierto. Las siguientes personas han colaborado con este plugin.

Colaboradores

«Image Color Palette» ha sido traducido a 1 idioma local. Gracias a los traductores por sus contribuciones.

Traduce «Image Color Palette» a tu idioma.

¿Interesado en el desarrollo?

Revisa el código , echa un vistazo al repositorio SVN o suscríbete al registro de desarrollo por RSS.

Registro de cambios

1.5.0

  • Added linter for development
  • Updated dependencies
  • Minor fixes

1.4.2

  • Monochromatic scheme colors are now sorted by brightness.
  • Fixed small bug which recalculated color palette unnecessarily.
  • Fixed popover menu not appearing with the correct z-index.
  • Raised minimum WordPress version to 5.2 to make use of block-editor package.

1.4.1

  • Fixed bug where no version number was being added to the enqueues.

1.4.0

  • Added Color distance equation option.
  • Added more core block types to set it’s color attributes.
  • Added the filter «imageColorPalette.addBlockTypeColorAttributes» for developers to include their own block type attributes.
  • Updated the color menu UI.
  • Rebuilt code, migrated JavaScript to TypeScript.

1.3.1

  • Corregido bloque seleccionado antes de abrir la barra lateral del plugin no pasaba las opciones de los atributos al menú del color.

1.3.0

  • Añadida una nueva característica para pegar el color automáticamente en el atributo del color del bloque seleccionado (actualmente está disponible para bloques por defecto)
  • Añadido un nuevo menú popover al hacer clic en un color
  • Pequeñas correcciones

1.2.0

  • Mejora de código e interfaz
  • La interfaz se ha organizado en dos pestañas: Paleta y Ajustes
  • El esquema se puede cambiar directamente desde la Paleta

1.1.0

  • Mejora de la Experiencia de Usuario y mejora del rendimiento de la generación de la paleta.
  • Trasladado propiedades fuera de la redux store.
  • Reorganizado el código

1.0.0

  • Versión inicial.