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.
If uploading a custom font, make sure the font family name, font style, and font weight are correct.
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 that 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.
About font licensing
When you choose to upload a custom font to DSM, it’s important to ensure that you have the necessary rights to use the font in this way. Unless you own the font, you (or your organization) will need a license from a third-party font licensor to allow you to copy the font to a web server. So, when deciding whether to upload a custom font to DSM, it is always recommended that you consult your font licensor’s license agreement and informational materials.
Keep in mind that different fonts have different use restrictions and licenses—while some fonts require paid licenses, others are open source and may be used for free. If you’re unsure about whether an intended use is covered under your license, we recommend you check with the administrator of your account and/or the third-party font licensor.
For more information about uploading fonts to DSM, please refer to our Terms of Service. Also, by way of example, here are some publicly available informational resources from a few of the most common font licensors: