motion

{ "title":"Crisp edges/pixelated images", "description":"Forces images to be scaled with an algorithm that preserves contrast and edges in the image, without smoothing colors or introduce blur. This is intended for images such as pixel art. Official values that accomplish this for the `image-rendering` property are `crisp-edges` and `pixelated`.", "spec":"http://dev.w3.org/csswg/css-images-3/#valdef-image-rendering-crisp-edges", "status":"unoff", "links":[ { "url":"https://developer.mozilla.org/en-US/docs/Web/CSS/image-rendering", "title":"MDN article" }, { "url":"http://updates.html5rocks.com/2015/01/pixelated", "title":"HTML5Rocks article" } ], "bugs":[ { "description":"`image-rendering:-webkit-optimize-contrast;` and `-ms-interpolation-mode:nearest-neighbor` do not affect CSS images." } ], "categories":[ "CSS", "CSS3" ], "stats":{ "ie":{ "5.5":"n", "6":"n", "7":"a x #2", "8":"a x #2", "9":"a x #2", "10":"a x #2", "11":"a x #2" }, "edge":{ "12":"n", "13":"n", "14":"n" }, "firefox":{ "2":"n", "3":"n", "3.5":"n", "3.6":"y x #3", "4":"y x #3", "5":"y x #3", "6":"y x #3", "7":"y x #3", "8":"y x #3", "9":"y x #3", "10":"y x #3", "11":"y x #3", "12":"y x #3", "13":"y x #3", "14":"y x #3", "15":"y x #3", "16":"y x #3", "17":"y x #3", "18":"y x #3", "19":"y x #3", "20":"y x #3", "21":"y x #3", "22":"y x #3", "23":"y x #3", "24":"y x #3", "25":"y x #3", "26":"y x #3", "27":"y x #3", "28":"y x #3", "29":"y x #3", "30":"y x #3", "31":"y x #3", "32":"y x #3", "33":"y x #3", "34":"y x #3", "35":"y x #3", "36":"y x #3", "37":"y x #3", "38":"y x #3", "39":"y x #3", "40":"y x #3", "41":"y x #3", "42":"y x #3", "43":"y x #3", "44":"y x #3", "45":"y x #3", "46":"y x #3", "47":"y x #3" }, "chrome":{ "4":"n", "5":"n", "6":"n", "7":"n", "8":"n", "9":"n", "10":"n", "11":"n", "12":"n", "13":"n", "14":"n", "15":"n", "16":"n", "17":"n", "18":"n", "19":"n", "20":"n", "21":"n", "22":"n", "23":"n", "24":"n", "25":"n", "26":"n", "27":"n", "28":"n", "29":"n", "30":"n", "31":"n", "32":"n", "33":"n", "34":"n", "35":"n", "36":"n", "37":"n", "38":"n", "39":"n", "40":"n", "41":"y #4", "42":"y #4", "43":"y #4", "44":"y #4", "45":"y #4", "46":"y #4", "47":"y #4", "48":"y #4", "49":"y #4", "50":"y #4", "51":"y #4" }, "safari":{ "3.1":"n", "3.2":"n", "4":"n", "5":"n", "5.1":"n", "6":"a x #1", "6.1":"y x #3", "7":"y x #3", "7.1":"y x #3", "8":"y x #3", "9":"y x #3", "9.1":"y x #3" }, "opera":{ "9":"n", "9.5-9.6":"n", "10.0-10.1":"n", "10.5":"n", "10.6":"n", "11":"n", "11.1":"n", "11.5":"n", "11.6":"y x #3", "12":"y x #3", "12.1":"y x #3", "15":"n", "16":"n", "17":"n", "18":"n", "19":"n", "20":"n", "21":"n", "22":"n", "23":"n", "24":"n", "25":"n", "26":"n", "27":"n", "28":"y #4", "29":"y #4", "30":"y #4", "31":"y #4", "32":"y #4", "33":"y #4", "34":"y #4", "35":"y #4", "36":"y #4" }, "ios_saf":{ "3.2":"n", "4.0-4.1":"n", "4.2-4.3":"n", "5.0-5.1":"a x #1", "6.0-6.1":"a x #1", "7.0-7.1":"y x #3", "8":"y x #3", "8.1-8.4":"y x #3", "9.0-9.2":"y x #3", "9.3":"y x #3" }, "op_mini":{ "5.0-8.0":"n" }, "android":{ "2.1":"n", "2.2":"n", "2.3":"n", "3":"n", "4":"n", "4.1":"n", "4.2-4.3":"n", "4.4":"n", "4.4.3-4.4.4":"n", "46":"y #4" }, "bb":{ "7":"n", "10":"a x #1" }, "op_mob":{ "10":"n", "11":"n", "11.1":"n", "11.5":"n", "12":"y x #3", "12.1":"y x #3", "33":"y #4" }, "and_chr":{ "47":"y #4" }, "and_ff":{ "43":"y x #3" }, "ie_mob":{ "10":"a x #2", "11":"a x #2" }, "and_uc":{ "9.9":"a x #1" } }, "notes":"Note that prefixes apply to the value (e.g. `-moz-crisp-edges`), not the `image-rendering` property.", "notes_by_num":{ "1":"Supported using the non-standard value `-webkit-optimize-contrast`", "2":"Internet Explorer accomplishes support using the non-standard declaration `-ms-interpolation-mode: nearest-neighbor`", "3":"Supports the `crisp-edges` value, but not `pixelated`.", "4":"Supports the `pixelated` value, but not `crisp-edges`." }, "usage_perc_y":66.19, "usage_perc_a":18.47, "ucprefix":false, "parent":"", "keywords":"image-rendering,crisp-edges", "ie_id":"", "chrome_id":"5118058116939776", "firefox_id":"", "webkit_id":"", "shown":true }