Comparador de Imágenes

Herramienta gratuita para comparar imágenes. Compara dos imágenes en paralelo, con control deslizante, superposición onion-skin o resaltado por píxel. Todo en tu navegador, sin subir nada.

Compara dos imágenes de cuatro formas: en paralelo, deslizante, onion-skin o resaltado por píxel. Suelta dos imágenes y detecta al instante qué cambió. Ideal para regresiones de UI, revisiones de diseño y comparación de capturas. 🔒 Se ejecuta por completo en tu navegador. Las imágenes nunca se suben a ningún servidor.

Arrastra una imagen aquí o haz clic para elegir
Arrastra una imagen aquí o haz clic para elegir
Carga una imagen en cada lado para empezar a comparar.

Cómo funciona la comparación de imágenes

Cuatro formas de comparar

  • En paralelo — la comprobación más simple: ambas imágenes a tamaño completo, una junto a la otra.
  • Deslizante — un divisor arrastrable muestra la imagen antigua en un lado y la nueva en el otro, ideal para cambios de UI antes/después.
  • Onion skin — superpone la segunda imagen sobre la primera con opacidad ajustable, útil para detectar desplazamientos y desalineaciones.
  • Diff por píxel — compara cada píxel y pinta de rojo los que cambian, para que ni un solo píxel pase desapercibido.

La métrica del diff por píxel

En lugar de una resta RGB ingenua, el modo diff por píxel usa una métrica de distancia de color YIQ — el mismo enfoque que la popular librería pixelmatch. YIQ separa el brillo (Y) de la crominancia (I, Q), lo que se ajusta a cómo el ojo humano percibe la diferencia. Un control de umbral decide cuán grande debe ser una diferencia para marcar un píxel.

Escenarios comunes

  1. Pruebas de regresión de UI — compara una captura antes y después de un cambio de código.
  2. Revisión de diseño — verifica que la implementación coincide con el mockup.
  3. QA de compresión de imágenes — ve exactamente qué regiones alteró un codificador.
  4. Retoque fotográfico — confirma qué píxeles tocó una edición.

Todo se ejecuta con la API Canvas en tu navegador: sin subidas, sin esperas.

Preguntas frecuentes

¿Se suben mis imágenes a un servidor?
No. Toda la comparación ocurre localmente en tu navegador con la API Canvas. Tus imágenes nunca salen de tu dispositivo.
¿Y si las dos imágenes tienen tamaños distintos?
La herramienta las compara igualmente alineándolas a la esquina superior izquierda y usando el lienzo mayor. Un aviso muestra ambos tamaños. Para resultados exactos al píxel, usa imágenes del mismo tamaño.
¿Qué formatos son compatibles?
Todo lo que el navegador pueda decodificar: PNG, JPG, WebP, GIF (primer fotograma), BMP y SVG.
¿Qué hace el control de umbral?
Define cuánto deben diferir dos píxeles para contar como un cambio, usando una métrica de distancia de color YIQ. Menor = más estricto, mayor = más tolerante a cambios de color leves.
¿Cómo guardo el resultado del diff por píxel?
Cambia al modo Diff por píxel y haz clic en 'Descargar diff' para exportar el resultado resaltado como PNG.