Why aren't fonts displaying correctly in DSM?

When viewing text styles in your DSM website, you or your viewers may notice that the rendered samples don’t display the correct font. This can occur if the viewer doesn't have the needed fonts installed locally on their computer. However, it is possible to add fonts so the text styles display properly for all users.

Adding missing fonts

To add missing fonts in DSM:

1. Sign in to the DSM web view and open your design system.
   
   If a font is missing, a notification will appear on the settings icon () in the DSM edit bar.
2. Click the settings icon and select Settings.
3. On the left, click the Foundation fonts dropdown and then click any missing font, which will be flagged with a warning icon.
4. Click the appropriate tab—Google fonts, System fonts, Typekit, Fonts.com, or Custom—to search for and add the missing font.
   If uploading a custom font, ensure that the font family name, font style, and font weight are correct.
5. After adding the font, click Save.

The text style sample 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:

• Monotype: Font licensing 101
• Microsoft: Font redistribution FAQ for Windows
• Adobe: Font licensing
• Google Fonts: Frequently Asked Questions