microsoft / fluentui-system-icons

Fluent System Icons are a collection of familiar, friendly and modern icons from Microsoft.

Home Page:https://aka.ms/fluentui-system-icons

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

TTF bug in macOS

ZyeF opened this issue · comments

commented

Good morning,

On macOS, I noticed that all the icons are buggy.

This is mainly noticed when there are two identical shapes on the same icon (See below). But you should also know that when the icon is enlarged enough, the problem is no longer perceptible).

Capture d’écran 2024-01-02 à 11 41 42

The problem is certainly due to the software used to create the SVG files, because when recreating the same shapes with Affinity Designer everything is normal (See below).

Capture d’écran 2024-01-02 à 11 41 59

To quickly test and see the problem for yourself, you can either:
— look at the icons with the project's Flutter example app (adding macOS to the flutter project).
— go to Fontello with a Mac and drag one of the files indicated on the site.
— install the TTF file on macos and search for icons with the Font book application installed by default.

Example of problematic SVG files (There are many more; maybe all files):
— ic_fluent_arrow_clockwise_dashes_20_regular
— ic_fluent_alert_off_20_regular
— ic_fluent_align_bottom_20_regular
— ic_fluent_arrow_autofit_height_dotted_20_regular
— ic_fluent_arrow_autofit_width_dotted_20_filled
— ic_fluent_arrow_sync_checkmark_20_regular
— ic_fluent_closed_caption_off_20_regular
— ic_fluent_more_vertical_20_regular
— ic_fluent_more_horizontal_20_regular
— ic_fluent_more_vertical_20_filled

Here are two SVG files that I recreated (without bugs)
Archive.zip

commented

I found out where the problem with FontForge comes from. In fact, many symbols have errors in the directions of vector paths.

The solution (Please note, I translated from French):

  • Open the TTF file with FontForge.
  • Select all glyphs.
  • Right-click on a glyph to display the context menu and select "Correct Direction".
  • Click on the “File” menu and select “Generate Font”.
  • Choose “True Type” and generate…

(To check) I have the impression that the problem comes from the files generated by Adobe Illustrator.