Crisp edges/pixelated images

Scales images with an algorithm that preserves edges and contrast, without smoothing colors or introducing 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`.

W3C Candidate Recommendation: https://w3c.github.io/csswg-drafts/css-images-3/#valdef-image-rendering-crisp-edges

Usage: 96.3% + 0.53% = 96.8%

Support summary

IE: partial since 7, prefixed since 7, notes for version 7₂
Edge: Not supported, notes for version 79₄
Firefox: 93, prefixed since 3.6, notes for version 3.6₃, notes for version 65₃
Chrome: Not supported, notes for version 41₄
Safari: 10, partial since 6, prefixed since 6, notes for version 6₁, notes for version 6.1₃
Opera: prefixed since 11.6, notes for version 11.6₃, notes for version 28₄
Safari on iOS: 10.0-10.2, partial since 5.0-5.1, prefixed since 5.0-5.1, notes for version 5.0-5.1₁, notes for version 7.0-7.1₃
Opera Mini: Not supported
Android Browser: Not supported, notes for version 136₄
Blackberry Browser: partial since 10, prefixed since 10, notes for version 10₁
Opera Mobile: prefixed since 12, notes for version 12₃, notes for version 80₄
Chrome for Android: Not supported, notes for version 136₄
Firefox for Android: 137
IE Mobile: partial since 10, prefixed since 10, notes for version 10₂
UC Browser for Android: Not supported, notes for version 15.5₄
Samsung Internet: Not supported, notes for version 4₄
QQ Browser: Not supported, notes for version 14.9₄
Baidu Browser: Not supported, notes for version 13.52₄
KaiOS Browser: 3.0-3.1, notes for version 2.5₆

Notes

Note that prefixes apply to the value (e.g. `-moz-crisp-edges`), not the `image-rendering` property.

Supported using the non-standard value `-webkit-optimize-contrast` ↑
Internet Explorer accomplishes support using the non-standard declaration `-ms-interpolation-mode: nearest-neighbor` ↑
Supports the `crisp-edges` value, but not `pixelated`. ↑
Supports the `pixelated` value, but not `crisp-edges`. ↑
Only works on `<img>`, not CSS backgrounds or `<canvas>`. ↑
Only works on `<img>` and CSS backgrounds, _not_ `<canvas>`. ↑

Full support table

IE

5.5	6	7	8	9	10	11
n	n	a,x	a,x	a,x	a,x	a,x

Edge

12	13	14	15	16	17	18	79	80	81	83	84	85	86	87	88	89	90	91	92	93	94	95	96	97	98	99	100	101	102	103	104	105	106	107	108	109	110	111	112	113	114	115	116	117	118	119	120	121	122	123	124	125	126	127	128	129	130	131	132	133	134	135	136
n	n	n	n	n	n	n	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y

Firefox

2	3	3.5	3.6	4	5	6	7	8	9	10	11	12	13	14	15	16	17	18	19	20	21	22	23	24	25	26	27	28	29	30	31	32	33	34	35	36	37	38	39	40	41	42	43	44	45	46	47	48	49	50	51	52	53	54	55	56	57	58	59	60	61	62	63	64	65	66	67	68	69	70	71	72	73	74	75	76	77	78	79	80	81	82	83	84	85	86	87	88	89	90	91	92	93	94	95	96	97	98	99	100	101	102	103	104	105	106	107	108	109	110	111	112	113	114	115	116	117	118	119	120	121	122	123	124	125	126	127	128	129	130	131	132	133	134	135	136	137	138	139	140	141
n	n	n	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y,x	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y

Chrome

4	5	6	7	8	9	10	11	12	13	14	15	16	17	18	19	20	21	22	23	24	25	26	27	28	29	30	31	32	33	34	35	36	37	38	39	40	41	42	43	44	45	46	47	48	49	50	51	52	53	54	55	56	57	58	59	60	61	62	63	64	65	66	67	68	69	70	71	72	73	74	75	76	77	78	79	80	81	83	84	85	86	87	88	89	90	91	92	93	94	95	96	97	98	99	100	101	102	103	104	105	106	107	108	109	110	111	112	113	114	115	116	117	118	119	120	121	122	123	124	125	126	127	128	129	130	131	132	133	134	135	136	137	138	139
n	n	n	n	n	n	n	n	n	n	n	n	n	n	n	n	n	n	n	n	n	n	n	n	n	n	n	n	n	n	n	n	n	n	n	n	n	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y

Safari

3.1	3.2	4	5	5.1	6	6.1	7	7.1	8	9	9.1	10	10.1	11	11.1	12	12.1	13	13.1	14	14.1	15	15.1	15.2-15.3	15.4	15.5	15.6	16.0	16.1	16.2	16.3	16.4	16.5	16.6	17.0	17.1	17.2	17.3	17.4	17.5	17.6	18.0	18.1	18.2	18.3	18.4	18.5	TP
n	n	n	n	n	a,x	a,x	a,x	a,x	a,x	a,x	a,x	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y

Opera

9	9.5-9.6	10.0-10.1	10.5	10.6	11	11.1	11.5	11.6	12	12.1	15	16	17	18	19	20	21	22	23	24	25	26	27	28	29	30	31	32	33	34	35	36	37	38	39	40	41	42	43	44	45	46	47	48	49	50	51	52	53	54	55	56	57	58	60	62	63	64	65	66	67	68	69	70	71	72	73	74	75	76	77	78	79	80	81	82	83	84	85	86	87	88	89	90	91	92	93	94	95	96	97	98	99	100	101	102	103	104	105	106	107	108	109	110	111	112	113	114	115	116	117
n	n	n	n	n	n	n	n	y,x	y,x	y,x	n	n	n	n	n	n	n	n	n	n	n	n	n	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y

Safari on iOS

3.2	4.0-4.1	4.2-4.3	5.0-5.1	6.0-6.1	7.0-7.1	8	8.1-8.4	9.0-9.2	9.3	10.0-10.2	10.3	11.0-11.2	11.3-11.4	12.0-12.1	12.2-12.5	13.0-13.1	13.2	13.3	13.4-13.7	14.0-14.4	14.5-14.8	15.0-15.1	15.2-15.3	15.4	15.5	15.6-15.8	16.0	16.1	16.2	16.3	16.4	16.5	16.6-16.7	17.0	17.1	17.2	17.3	17.4	17.5	17.6-17.7	18.0	18.1	18.2	18.3	18.4	18.5
n	n	n	a,x	a,x	a,x	a,x	a,x	a,x	a,x	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y

Opera Mini

all
n

Android Browser

2.1	2.2	2.3	3	4	4.1	4.2-4.3	4.4	4.4.3-4.4.4	136
n	n	n	n	n	n	n	n	n	y

Blackberry Browser

7	10
n	a,x

Opera Mobile

10	11	11.1	11.5	12	12.1	80
n	n	n	n	y,x	y,x	y

Chrome for Android

136
y

Firefox for Android

137
y

IE Mobile

10	11
a,x	a,x

UC Browser for Android

15.5
y

Samsung Internet

4	5.0-5.4	6.2-6.4	7.2-7.4	8.2	9.2	10.1	11.1-11.2	12.0	13.0	14.0	15.0	16.0	17.0	18.0	19.0	20	21	22	23	24	25	26	27
y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y	y

QQ Browser

14.9
y

Baidu Browser

13.52
y

KaiOS Browser

2.5	3.0-3.1
y	y

y = supported
a = partially supported, see notes
x = supported with a prefix, e.g. moz, webkit
p = supported with a polyfill
d = available but disabled by default; the feature need to be enabled in about:config, chrome://flags, etc.
n = not supported
u = unknown/untested

Back to list