Newly available Useful when font-size-adjust affects readability, line flow, or typographic consistency. Treat it as a content-facing choice, not just decoration.

font-size-adjust

The font-size-adjust CSS property provides a way to modify the size of lowercase letters relative to the size of uppercase letters, which defines the overall font-size. This property is useful for situations where font fallback can occur.

Legibility can become an issue when the first-choice font-family is unavailable and its replacement fallback font has a significantly different aspect value (height of lowercase letters divided by font size). Legibility of fonts, especially at small font sizes, is determined more by the size of lowercase letters than by the size of uppercase letters. The font-size-adjust property is useful for adjusting the font size of fallback fonts to keep the aspect value across fonts consistent, ensuring that the text appears similar regardless of the font used.

Typography

Browser support

Feature Desktop Mobile
Chrome
Edge
Firefox
Safari
Chrome Android
Safari iOS
font-size-adjust
127
127
3
16.4
127
16.4
CSS at-rule
size-adjust

The size-adjust CSS descriptor for the @font-face at-rule defines a multiplier for glyph outlines and metrics associated with this font. This makes it easier to harmonize the designs of various fonts when rendered at the same font size.
92
92
92
17
92
17
CSS property
from-font
127
127
118
17
127
17
none
127
127
3
16.4
127
16.4
two-values

Two-value syntax
127
127
92
17
127
17
Other
svg.global_attributes.font-size-adjust

The font-size-adjust attribute allows authors to specify an aspect value for an element that will preserve the x-height of the first choice font in a substitute font.
127
127
3
16.4
127
16.4
1+Supported (version) Not supported ※Has note Sub-feature descriptions sourced from MDN Web Docs (CC BY-SA 2.5)
Notes 4 item(s)
Implementation note
  • Before Firefox 40, `font-size-adjust: 0` was incorrectly interpreted as `font-size-adjust: none` (bug 1144885).
  • Only supported on Windows.
Limitation
  • This browser only partially implements this feature
Removed
  • This feature was removed in a later browser version (3)
Notes 4 item(s)
Implementation note
  • Before Firefox 40, `font-size-adjust: 0` was incorrectly interpreted as `font-size-adjust: none` (bug 1144885).
  • Only supported on Windows.
Limitation
  • This browser only partially implements this feature
Removed
  • This feature was removed in a later browser version (3)

Syntax

CSS 
body {
  font-family: "Ideal Sans", Verdana, sans-serif;
  font-size-adjust: 0.5;
}

/* Use a specific metric as a reference */
.adjusted {
  font-size-adjust: ex-height 0.48;
}

Live demo

adjust none

font-size-adjust adjust none demo.

PreviewFullscreen

font-size-adjust: 0.5

font-size-adjust Font-size-adjust: 0.5 demo.

PreviewFullscreen

Ex-heightspecified

font-size-adjust Ex-heightspecified demo.

PreviewFullscreen

Use cases

  • Reading rhythm

    Use font-size-adjust to improve how text wraps, aligns, or scales in dense layouts and editorial UI.

  • Language-aware text

    Adjust typography when script direction, spacing, or writing rules differ across languages.

Cautions

  • Test with real content rather than short placeholder strings because typographic behavior changes with length and language.
  • Prefer the smallest rule that solves the layout problem so text remains easy to maintain.

Accessibility

  • Typography choices should preserve readability at high zoom and on narrow screens.
  • Avoid stylistic settings that reduce comprehension or make scanning harder.

Related links