JSFiddle - React, Tailwind, and code Playground

by David Storey

HTML

<img id="one" src="http://placehold.it/350x150"/>
<img id="two" src="http://placehold.it/350x150"/>
<img id="three" src="http://placehold.it/350x150"/>

CSS

#one {
    image-rendering: auto;
}
#two {
    image-rendering: -webkit-crisp-edges;
    image-rendering: -moz-crisp-edges;
    image-rendering: -ms-crisp-edges;
    image-rendering: -o-crisp-edges;    
    image-rendering: crisp-edges;
}
#three {
    image-rendering: -webkit-pixelated;
    image-rendering: -moz-pixelated;
    image-rendering: -ms-pixelated;
    image-rendering: -o-pixelated;
    image-rendering: pixelated;
}