🚀 Explore Professional Capabilities
Surgical precision in every pixel. Clarity in every Pull Request.
- 🧠 Pixel-Level Intelligence: Automatically identifies and highlights exact pixel modifications between original and updated images.
- 🛡️ Quality Guardrails: Prevents accidental UI regressions by providing absolute clarity in Pull Request reviews.
- ✨ Premium Integration: Seamlessly injects a high-fidelity "Visual Diff" button into the standard GitHub UX.
- 🚥 Enterprise Standards: Built with Manifest V3 and styled with a sleek glassmorphism aesthetic for top-tier performance.
- DOM Observation: The engine monitors GitHub's "Files changed" section for image modifications.
- Action Injection: A surgical Visual Diff button is injected into the header of every detected image file.
- Canvas Processing: Upon activation, the engine extracts the "Before" and "After" images and processes them through an HTML5 Canvas-based bitwise comparison.
- Visual Result: A high-fidelity modal overlay renders the difference map, highlighting changes in surgical magenta.
Visionary PR Diff provides three distinct modes of analysis to ensure no visual regression goes undetected:
The classic architectural comparison. Ideal for verifying general layouts and structural integrity where side-by-side context is paramount.
Our flagship mode. Provides perfect architectural symmetry by rendering the Source, Difference Map (Surgical Magenta), and Target in a single, high-fidelity view. This is the gold standard for pixel-perfect verification.
An interactive slider that allows you to "wipe" the new version over the old one. Perfect for detecting subtle 1-pixel shifts or font-rendering changes that side-by-side views might miss.
Click to expand installation steps
- Clone the repository to your local machine.
- Open Chrome and navigate to
chrome://extensions/. - Enable Developer mode (toggle in the top right corner).
- Click Load unpacked and select the repository directory.
- Watch the magic happen on your next GitHub PR with images!
We value professional contributions. Maintain the highest standards of engineering excellence by following our guidelines:
| Resource | Description |
|---|---|
| Contributing | How to help improve the engine. |
| Changelog | Tracking our progress and releases. |
| Security | Our commitment to vulnerability management. |
| Code of Conduct | Maintaining a professional environment. |
Distributed under the MIT License. See the LICENSE file for more information.