coderef

crisp-edgesBaseline · Newly available

The image-rendering: crisp-edges CSS declaration scales images to preserve lines without blurring.

Works in the latest version of every major browser, but older devices may not support it yet. Baseline since May 7, 2026.

How to use ↓Compare browsers

Browser support

DesktopChrome
1–147Not supported
148+Supportedsince May 5, 2026
Current: 155
Edge
12–147Not supported
148+Supportedsince May 7, 2026
Current: 154
Firefox
1–64Not supported
65+Supportedsince Jan 29, 2019
Current: 157
Safari
1–6Not supported
7+Supportedsince Oct 22, 2013
Current: 27
MobileChrome Android
18–147Not supported
148+Supportedsince May 5, 2026
Current: 155
Firefox Android
4–64Not supported
65+Supportedsince Jan 29, 2019
Current: 157
Safari iOS
1–6Not supported
7+Supportedsince Sep 18, 2013
Current: 27

How to use

Every current browser supports this, but it only became Baseline on May 7, 2026. Use it as a progressive enhancement, or keep a fallback if you support older devices.

Example

Full syntax and examples are on MDN — see the links below.

Feature detection

CSS · check before using
@supports (image-rendering: crisp-edges) {
  /* styles that rely on image-rendering: crisp-edges */
}

/* or in JavaScript */
if (CSS.supports("image-rendering", "crisp-edges")) {
  // use it
}

Specification