font-optical-sizing
The font-optical-sizing CSS property sets whether text rendering is optimized for viewing at different sizes.
Overview
The font-optical-sizing CSS property sets whether text rendering is optimized for viewing at different sizes.
Browser support
| Feature | Desktop | Mobile | ||||
|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Chrome Android | Safari iOS | |
| 79 | 17 | 62 | 13.1 | 79 | 13.4 | |
auto | 79 | 17 | 62 | 13.1 | 79 | 13.4 |
none | 79 | 17 | 62 | 13.1 | 79 | 13.4 |
1+Supported (version) Not supported ※Has note Sub-feature descriptions sourced from MDN Web Docs (CC BY-SA 2.5)
Syntax
CSS
body {
font-optical-sizing: auto;
}
.no-optical {
font-optical-sizing: none;
}Live demo
Use cases
Using font-optical-sizing
The font-optical-sizing CSS property sets whether text rendering is optimized for viewing at different sizes.
Cautions
- May not be supported in older browsers.
Accessibility
- Make sure visual changes are conveyed appropriately to assistive technology.
Related links
Powered by web-features