When accessing your Design System Manager (DSM) library via the web view, you or your viewers may notice that the original fonts fail to display. This can occur if the text styles were added to the library via the DSM tool in Sketch but the viewer does not have those particular fonts installed locally on their computer.
To ensure that your fonts display correctly for all viewers:
- Sign in to the DSM web view (this step must be completed by an admin or editor).
- Click the desired library to open it.
- Navigate to the left sidebar menu, and click Fonts.
- Hover over the font that is not displaying correctly, and click the ••• (more) icon.
- Click Change font family.
- Select your desired font service, or upload a custom font.
Note: If uploading a custom font, make sure the font family name, font style, and font weight are correct.
- Click Save.
The font should now display properly for all viewers.
Mapping text styles to font styles
Each text style has a weight and italic property. Together these two properties are matched to the corresponding font file. Therefore, when you upload your fonts via the DSM web view, make sure that the fonts have the same weight and italic properties as the text style.
For example, say you defined a text style which uses the Maison Neue font family and a bold style. You’d want to upload the file "MaisonNeue-Bold.ttf" to the DSM web view so the browser can use the file to render the matching text style.