Inicio / Herramientas de Color / Herramienta en línea de extracción de colores de imágenes por lotes

Herramientas online gratis

Herramienta en línea de extracción de colores de imágenes por lotes

Extrae paletas de colores de hasta 30 imágenes a la vez. Haz clic para muestrear píxeles, ajusta la capacidad y exporta en CSS, SVG o PNG. El procesamiento s…

Empezar a usar

Características y ejemplo práctico

Problema que resuelve

Cuando diseñas una interfaz o una ilustración, necesitas extraer los colores exactos de varias imágenes de referencia. Hacerlo una por una con un cuentagotas es lento. Esta herramienta te permite procesar un lote de imágenes y obtener paletas editables y exportables en un solo flujo.

Ejemplo de uso

Supón que seleccionas dos imágenes: logo.png y fondo.jpg. Cada una recibe una paleta inicial de 10 colores. Haces clic en un píxel del logo y el color se añade como #FF5733. Ajustas la capacidad de la paleta del logo a 12 con el control +. Luego abres el diálogo de exportación y descargas logo-palette.svg y fondo-palette.png. También copias el código CSS con las variables $color-1 para usarlas en tu proyecto.

Parámetros y procesamiento

Máximo 30 imágenes por lote.
Cada imagen: hasta 25 MB y 24.000.000 de píxeles.
Lote total: hasta 100 MB y 40.000.000 de píxeles.
Capacidad de paleta por imagen: de 1 a 20 colores.
Las imágenes se reducen a 760×520 píxeles para la vista previa; el muestreo se hace sobre el píxel renderizado, no sobre el original.
No se eliminan duplicados ni se calculan colores dominantes.

Limitaciones

La herramienta muestrea píxeles exactos; no agrupa colores similares ni elimina duplicados. No conserva las coordenadas originales de los píxeles en la exportación. El procesamiento es local en tu navegador: las imágenes no se suben a ningún servidor.

Preguntas frecuentes

¿Cómo puedo aumentar el número de colores de una paleta?

Usa el control + (más) de cada imagen. La capacidad aumenta hasta 20, pero no se añaden colores automáticamente; debes hacer clic en la imagen para muestrear nuevos píxeles.

¿Qué ocurre si reduzco la capacidad de una paleta que tiene más colores que el nuevo límite?

Se eliminan los colores más recientes hasta que la paleta se ajusta al nuevo límite. Por ejemplo, si tienes 15 colores y reduces la capacidad a 10, se eliminan los 5 últimos añadidos.

¿Puedo exportar las paletas de todas las imágenes a la vez?

No. Cada imagen tiene su propio diálogo de exportación. Debes abrirlo individualmente y elegir el formato (CSS, Código, SVG o PNG) para cada imagen.

Lista de verificación

Selecciona hasta 30 imágenes con formato válido.
Verifica que cada imagen no supere 25 MB y 24 millones de píxeles.
Haz clic en las imágenes para muestrear los colores deseados.
Ajusta la capacidad de cada paleta según necesites.
Copia los valores HEX, RGB o HSL desde el panel de color actual.
Exporta cada paleta en el formato requerido.

El procesamiento se realiza localmente en tu navegador.

Cómo usar

Cómo extraer colores de varias imágenes

Selecciona hasta 30 imágenes en formato PNG, JPEG o WebP. Cada archivo debe pesar menos de 25 MB y tener menos de 24 millones de píxeles. El lote completo no debe superar los 100 MB ni los 40 millones de píxeles.
Espera a que cada imagen se decodifique. Verás una paleta inicial con 10 colores muestreados automáticamente de posiciones aleatorias.
Haz clic en cualquier punto de una imagen para muestrear el píxel exacto bajo el cursor. El color se añade a la paleta de esa imagen en formato HEX (por ejemplo, #A1B2C3). Si la paleta está llena, se elimina el color más antiguo.
Usa los controles menos (−) y más (+) para ajustar la capacidad de cada paleta entre 1 y 20 colores. Al reducir la capacidad se eliminan los colores más recientes si superan el nuevo límite.
Pasa el cursor sobre un color de la paleta y haz clic para copiar su valor HEX. El panel de color actual muestra el último color muestreado en HEX, RGB y HSL, con botones para copiar cada formato.
Abre el diálogo de exportación de cada imagen (está colapsado por defecto). Elige entre CSS, Código, SVG o PNG. En CSS obtienes variables CSS HEX, SCSS HEX y SCSS RGB. En Código obtienes valores HEX separados por comas (sin #) y un array estilo JSON. Copia o descarga el resultado.