Welcome to Pixelsior!

Pixelsior is a simple tool to compare how well your html+css matches the design.

Here is a simple guide on how to use it:

First, open your design, make sure the scale is 100%. Take a screenshot of the element you are interested in and drag it to this page.

Next, open your html+css, scale the page to 100%, take a screenshot of the same element and drag it here.

Now that there are 2 images on this page, just drag the second one on top of the first!

The better the pixels match each other in terms of color, the blacker it will be.

The greater the difference, the brighter the color will be!

Let's go!