https://fadedimon.github.io/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!