Is there an existing issue for this?

• I have searched the existing issues
• I have read the guide to filing a bug

Internal report:

• https://chat.google.com/room/AAAANQ6-YFo/dQuccGsgosc

Older issue:

• [web] Some Unicode character not being shown  #77465

Fixed here:

• [reland] Canvaskit get googlefont data engine#35646

Steps to reproduce

Attempt to render some of the following glyphs on your Flutter web app:

⌘ ⌥ ⌃ ⇧

(These are very common for MacOS "localization" and keyboard shortcuts in menus)

It shows up as Unicode tofu briefly, and then falls back to... something. I can't figure out what, the fallback font list just says "sans-serif", but whatever it is uses versions of those glyphs that are pretty hideous.

Expected results

The symbols render normally.

Actual results

The symbols eventually rendered don't look good.

The symbols live in the following blocks:

• https://en.wikipedia.org/wiki/Miscellaneous_Technical ( ⌘⌥⌃ )
• https://en.wikipedia.org/wiki/Arrows_(Unicode_block) ( ⇧ )

And Flutter Web seems to be using TWO fallback fonts to render them:

• Noto Sans Symbols (for ⌃)
• Noto Sans Symbols 2 (for ⌘⌥⇧)

(At least according to the Google Fonts online tester)

The only font I could find that contains all 4 glyphs, that look similar to what they do normally in MacOS is "Inter": https://fonts.google.com/specimen/Inter (there's probably more but it's hard to find fonts by glyph manually in google fonts!)

Should we add "Inter" as one of the fallback fonts, maybe even before the Noto Symbols?

Screenshot

(Comparison of all 3 fonts)