Comparar dos imágenes online — diferencias
Encuentra y marca los píxeles distintos entre dos imágenes, con vistas superpuesta y de deslizador
Funciona en tu navegador · no se sube nada
Imagen A (original)
Imagen A (original)
Añade primero la imagen de referencia. JPG, PNG, WebP, GIF o BMP; también puedes pegarla con Ctrl+V.
Imagen B (modificada)
Imagen B (modificada)
Añade la imagen modificada. Cuando A ya está, lo que pegues (Ctrl+V) va a B.
0 detecta el cambio de color más pequeño; los valores más altos tratan los colores parecidos como iguales. El 0,1 por defecto ignora el ruido típico de la compresión JPG.
Si está desactivado, los píxeles de borde suavizado que difieren se muestran en amarillo y no entran en el recuento.
Añade las dos imágenes y la comparación empezará al momento.
Qué hace
Esta herramienta encuentra dónde se diferencian dos imágenes que parecen iguales, hasta el último píxel. Pequeños cambios de texto, un desplazamiento de 1 píxel o un cambio de color que se te escaparían alternando entre ambas quedan marcados en rojo. Úsala para confirmar que un cambio en una web se ve como debía, para descubrir qué ha cambiado un diseñador en una revisión o para revisar una prueba de imprenta. Además de la vista de diferencias, puedes superponer las imágenes o dividirlas con un deslizador antes/después.
Cómo se usa
- Pon la imagen de referencia en Imagen A y la modificada en Imagen B. Las capturas se pueden pegar con Ctrl+V; cuando A ya está, lo que pegues va a B.
- La comparación empieza en cuanto están las dos: aparecen el número y la proporción de píxeles distintos y la posición de la zona cambiada.
- Mueve la Sensibilidad para decidir cuánto cambio de color pequeño se ignora.
- En Vista, elige Diferencias, Superposición (con la opacidad de B) o Deslizador (A a la izquierda, B a la derecha).
- Haz clic en Guardar PNG de diferencias para descargar el resultado.
Cómo funciona
- Comparación de píxeles: los colores en la misma posición se comparan por su distancia en el espacio de color YIQ, que sigue cómo percibimos el brillo. Un umbral de 0 detecta el cambio más pequeño; los valores cercanos a 1 son tolerantes. Por defecto es 0,1.
- Antialiasing: los píxeles detectados como bordes suavizados, en comparación con sus vecinos, se dibujan en amarillo y no entran en el recuento (opcional).
- Imagen de diferencias: las zonas sin cambios muestran el original en gris atenuado (10 %), y los píxeles distintos, en rojo.
- Tamaño: por encima de 8 millones de píxeles, las dos imágenes se reducen con el mismo factor para compararlas, y las coordenadas de la zona cambiada se convierten de vuelta a los píxeles originales de A.
- El motor de comparación es pixelmatch (licencia ISC).
Ejemplos
| A | B | Resultado |
|---|---|---|
| Captura de antes, 1280×800 | La misma página con otro texto en un botón | Rojo solo alrededor del botón, con las coordenadas de la zona |
| Foto PNG | El mismo archivo otra vez | Mensaje de «Sin diferencias» |
| Banner de 1200×600 | El banner recortado a 1000×600 | Con los tamaños mantenidos, toda la franja recortada de 200 px cuenta como diferente |
Para diferencias en textos, usa el comparador de textos; para recortar una parte de la imagen y mirarla de cerca, prueba el recortador de imágenes.
Preguntas frecuentes
¿Puedo comparar imágenes de distinto tamaño?
Sí. «Ajustar B a A» es para la misma pantalla guardada a otra resolución; «Mantener tamaños, alinear arriba a la izquierda» es para una imagen recortada o ampliada. Con los tamaños mantenidos, todo lo que solo cubre una de las imágenes cuenta como diferente.
Las imágenes JPG muestran demasiadas diferencias.
La compresión JPG deja cambios de color diminutos que no se ven. Subir el umbral de 0,1 a 0,2–0,3 aproximadamente ignora ese ruido y mantiene los cambios reales.
¿Qué son los píxeles amarillos?
Píxeles de borde suavizado de textos y líneas (antialiasing) que difieren ligeramente, a menudo solo por cómo se dibuja la fuente. Por defecto se muestran en amarillo y no se cuentan; marca la opción para contarlos.
¿Para qué sirve?
Para comparar capturas antes y después de un cambio en una web, detectar los cambios de una revisión de diseño, comprobar una prueba de imprenta frente al original o resolver pasatiempos de buscar las diferencias.
¿Se suben mis imágenes?
No. Las dos imágenes se comparan solo en tu navegador.
