Comparar imágenes y ver diferencias
Compara dos imágenes con un deslizador de antes/después, lado a lado o un mapa de diferencias de píxeles que resalta los cambios en rojo e indica el porcentaje distinto.
Se ejecuta completamente en tu navegador. Tus datos nunca se suben.
Herramientas Relacionadas
Ver Todas¿Qué es Comparar imágenes?
Carga dos imágenes y compáralas de tres formas: un deslizador que muestra una sobre la otra, lado a lado o un mapa de diferencias en el que los píxeles cambiados aparecen en rojo. La herramienta cuenta los píxeles distintos y muestra el porcentaje de diferencia, con una tolerancia por canal ajustable para ignorar pequeñas diferencias de compresión.
Cómo usar Comparar imágenes
- Suelta o elige Imagen A (referencia) e Imagen B (a comparar).
- Cambia entre Deslizador, Lado a lado y Diferencias.
- Lee el porcentaje de diferencia y el número de píxeles.
- Sube la Tolerancia por canal (0–255) para ignorar diferencias pequeñas, como el ruido de JPEG.
Ejemplo
Dos imágenes de 40×20 que solo difieren en el cuadrante inferior derecho (blanco frente a negro), tolerancia 0
25% of pixels differ (200 of 800 pixels)
Cuándo usar Comparar imágenes
Úsalo para detectar cambios entre dos versiones de un diseño, una captura o un render, comprobar artefactos de compresión o hacer una revisión rápida de regresión visual. Compara píxeles en la misma posición, así que el contenido desplazado o rotado cuenta como totalmente distinto; no es una métrica de similitud perceptual ni estructural.
Cómo funciona Comparar imágenes
Ambas imágenes se decodifican a RGBA. Si sus tamaños difieren, la imagen B se remuestrea al tamaño de la imagen A (y un aviso lo indica). Se compara cada par de píxeles: si la diferencia absoluta de R, G, B o alfa supera la tolerancia, el píxel cuenta como diferente y se pinta de rojo en el mapa de diferencias; los píxeles iguales se muestran en una escala de grises atenuada de la imagen A. % de diferencia = píxeles distintos ÷ píxeles totales × 100.
Casos de Uso Comunes
- Ver qué cambió entre dos capturas de una interfaz.
- Comparar una foto original con su versión comprimida.
- Verificar que un recurso reexportado es idéntico.
- Mostrar ediciones de antes y después con el deslizador.
Nota de Seguridad
Las imágenes se decodifican, procesan y codifican en local en tu navegador con la API Canvas. No se sube nada a ningún servidor.
Preguntas Frecuentes
¿Qué pasa si las imágenes tienen tamaños distintos?
La imagen B se redimensiona al tamaño de la imagen A antes de comparar y se muestra una advertencia. Para resultados exactos, compara imágenes con las mismas dimensiones.
¿Para qué sirve la tolerancia?
Un píxel solo cuenta como distinto cuando uno de sus canales difiere más que la tolerancia (0–255). Usa entre 5 y 20 para ignorar el ruido de la compresión con pérdida.
¿Cuenta la transparencia?
Sí. El canal alfa se compara igual que los canales de color.