add support for the new 'system-ui' generic font family

Assigned to



4 years ago
4 months ago


(Reporter: jtd, Assigned: jtd)


(Blocks 2 bugs, {dev-doc-needed, parity-chrome, parity-safari})

Dependency tree / graph

Firefox Tracking Flags

(firefox45 affected, firefox59 affected)




4 years ago
The CSSWG resolved today to add a new generic font family name, 'system-ui', that maps to the default system UI font.

This will be specified in the CSS4 Fonts spec.

Three components to this:

- parsing and handling of the new generic in CSS code
- platform-specific lookup, lang dependent
- appropriate handling of things like fallback

The last item is probably the trickiest. Under OSX, the "system" font is always a Latin font, e.g. San Francisco or Helvetica Neue, but it's linked to a specific set of fallback font families, so that the Latin font is used for Latin glyphs and a system Japanese font is used for Japanese. Need to research what happens precisely under Windows (i.e. always Meiryo UI or only for CJK characters?).

Comment 1

3 years ago
Chrome: Intent to Implement and Ship: The “system-ui” generic font family!topic/blink-dev/hvN9YVvIb5c

Comment 2

2 years ago
Chrome shipped font-family:system-ui in version 56 some month ago.
Safari fixed in 2017-02:

Chrome status entry says Firefox shipped also ...


2 years ago
Keywords: dev-doc-needed
(In reply to j.j. from comment #2)
> Chrome status entry says Firefox shipped also ...

That seems wrong.  I'll email Koji.
Would be interested in this for DevTools. We use Firefox-only things like font:message-box, which has the downside of a) resetting the font-size and b) resetting it to different values depending on the platform.

(Some tools such as debugger-html and perf-html are also used outside of Firefox, so a standard solution would be best.)
You need to log in before you can comment on or make changes to this bug.