Create a gist now

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Preserve pixelation when scaling pixel art with CSS - https://builtvisible.com/image-scaling-in-css/
@mixin pixelated {
-ms-interpolation-mode: nearest-neighbor; // IE 7+ (non-standard property)
image-rendering: -webkit-optimize-contrast; // Safari 6, UC Browser 9.9
image-rendering: -webkit-crisp-edges; // Safari 7+
image-rendering: -moz-crisp-edges; // Firefox 3.6+
image-rendering: -o-crisp-edges; // Opera 12
image-rendering: pixelated; // Chrome 41+ and Opera 26+
}
@ArloJamesBarnes

This comment has been minimized.

Show comment
Hide comment
@ArloJamesBarnes

ArloJamesBarnes Mar 29, 2016

Very useful in the custom CSS field of the Imagus browser extension.

Very useful in the custom CSS field of the Imagus browser extension.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment