Use img { image-rendering: pixelated }
Open
- Dominant language
- JavaScript
- Stars
- 7.2k
- Forks
- 621
- PR merge metrics
- No merged PRs in 30d
Description
Chrome automatically applies smoothing when drawing images to screen when in retina mode while the image was captured non-retina.
Since backstop's goal is to compare images, the smoothing is counterproductive. I am not seeing what the browser actually rendered - I get a blurred version instead.
The `img { image-rendering: pixelated }` style makes the image comparison render much crisper.
I am currently applying this style in DevTools, but I figure this could be done automatically by backstop.js.
Contributor guide
Assessment
This issue has not been assessed yet.