#557: [Review Request] New CSS @font-face descriptors for overriding font metrics

Visit on Github.

Opened Sep 16, 2020

Saluton TAG!

I'm requesting a TAG review of new CSS descriptors ascent-override, descent-override and line-gap-override for @font-face rule. (design doc)

Example usage:

@font-face {
  font-family: arial;
  src: local(Arial), url("http://example.com/arial.woff");
  ascent-override: 60%;
  descent-override: 40%;
  line-gap-override: 0%;
}

This allows web authors to override the metrics of a font and control text position within a line: the ascent, descent and line gap are set to exactly 60%, 40% and 0% of the em size. See also demo and its video recording.

There are two major use cases:

  1. Improve interoperability. Different browsers on different platforms currently use different pieces of data from a font file, causing interop issues. This can be fixed by overriding the font metrics.
  2. Reduce layout shifting caused by web fonts, by overriding the metrics of the fallback font to match the web font
  • Explainer¹ (minimally containing user needs and example code): as given above
  • Specification URL: Please refer to design doc for now. CSSWG has just resolved to add these descriptors and will add a spec soon
  • Tests: Currently as Chromium web tests. Will upstream to WPT soon.
  • Security and Privacy self-review²: None
  • Primary contacts (and their relationship to the specification):
    • Xiaocheng Hu (@xiaochengh), Google
  • Organization(s)/project(s) driving the specification: CSSWG
  • External status/issue trackers for this specification: Chrome status

Further details:

  • I have reviewed the TAG's API Design Principles
  • Relevant time constraints or deadlines: Oct 15, 2020 (Chrome M87 Beta Promotion)
  • The group where the work on this specification is currently being done: CSSWG
  • Major unresolved issues with or opposition to this specification: None

You should also know that...

[please tell us anything you think is relevant to this review]

We'd prefer the TAG provide feedback as (please delete all but the desired option):

💬 leave review feedback as a comment in this issue and @-notify @xiaochengh

Discussions

Comment by @svgeesus Sep 18, 2020 (See Github)

The proposal can now be viewed in the CSS Fonts 4 specification

Comment by @atanassov Sep 23, 2020 (See Github)

@plinss and myself reviewed the request during our Cork virtual f2f. On the back of the exhaustive discussion and consensus with the CSSWG last week we are satisfied with the proposal. One nit which we have and will open as an issue with CSSWG is dropping the -override from the name.

Comment by @xiaochengh Sep 23, 2020 (See Github)

Thanks for reviewing!

Comment by @drott May 4, 2021 (See Github)

With the same intent to closer match fallback metrics to primary fonts the size-adjust descriptor to @font-face has been added.