Introducing PixelPerfectJs

PixelPerfectJs allows developers to put an image overlay on top of your HTML page and achieve pixel precise results.

How to use:
Save the following link as a bookmark, or drag it to the links/bookmarks bar in your browser:


Or if you don’t want to use the bookmarklet, just add the following line before your closing body tag:
<script type="text/javascript" src="//"></script>

The PixelPerfectJS panel will then be displayed.

* Enable: Yes/No. Whether you want to enable PixelPerfectJs or not
* Designs: Enter the image URL you want to overlay on top of your HTML. It must be either an absolute or relative URL. You can add as many images as you want.
* Position: You can manually set the position of the overlay
* Opacity: Control the opacity of the overlay.

* Simple! Just add 1 line of javascript!
* Not an extension or addon. Will work in any browser!
* No image size restrictions!
* Multiple overlays support
* Your settings are saved between sessions.

Please send bug reports and ideas for future versions to:

You can find the code on GitHub too:
Feel free to contribute!

Be Sociable, Share!