coderef

font-size-adjustBaseline · Newly available

The font-size-adjust CSS property preserves apparent text size, regardless of the font used, by scaling fonts to the same size with respect to a specific metric, such as x-height. This can help make fallback fonts look the same size.

Works in the latest version of every major browser, but older devices may not support it yet. Baseline since Jul 25, 2024.

Browser support

DesktopChrome
1–126Not supported
127+Supportedsince Jul 23, 2024
Current: 155
Edge
12–126Not supported
127+Supportedsince Jul 25, 2024
Current: 154
Firefox
1–117Not supported
118+Supportedsince Sep 26, 2023
Current: 157
Safari
1–16.6Not supported
17+Supportedsince Sep 18, 2023
Current: 27
MobileChrome Android
18–126Not supported
127+Supportedsince Jul 23, 2024
Current: 155
Firefox Android
4–117Not supported
118+Supportedsince Sep 26, 2023
Current: 157
Safari iOS
1–16.6Not supported
17+Supportedsince Sep 18, 2023
Current: 27

How to use

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

Example

Full syntax and examples are on MDN: size-adjust.

Feature detection

CSS · check before using
@supports (font-size-adjust: initial) {
  /* styles that rely on font-size-adjust */
}

/* or in JavaScript */
if (CSS.supports("font-size-adjust", "initial")) {
  // use it
}

Sub-features

Support for each part of the feature (6). The overall table above shows when the whole feature works.

Sub-featureChromeEdgeFirefoxSafariChrome AndroidFirefox AndroidSafari iOS
@font-face.size-adjust92929217929217
font-size-adjust127127316.4127416.4
font-size-adjust.from-font1271271181712711817
font-size-adjust.none127127316.4127416.4
font-size-adjust.two-values12712792171279217
svg.global_attributes.font-size-adjust127127316.4127416.4