Fonts in legacy DSM

On your DSM documentation site, there is a Fonts section that contains all the fonts associated with your library's text styles.

For fonts to appear in the Fonts section, you must first add text styles to your legacy design system via the DSM Sketch plugin. To learn more about adding text styles to your design system, read the section "Adding and applying text styles" in this article: Building and using a legacy DSM design system

Accessing the Fonts section

To access the Fonts section of your design system:

1. Sign in to the DSM web view and open your legacy design system.
2. In the left-hand navigation, click the Fonts section.

Viewing fonts

Once in the Fonts section, click any font to view Font styles and General info. If wanted, you can also add a description.

Editing and removing fonts

As previously mentioned, it's not possible to add fonts directly from the DSM web view. However, you can edit or remove existing fonts. To do so, navigate to the Fonts section. Hover over the desired font and click the ••• (more) icon. You should notice three options:

• Define fallback fonts
• Change font family
• Remove font family

Define fallback fonts

Defining a fallback font can be helpful if your design system contains a font that is often not supported by web browsers. If your original font won't render, your fallback font appears instead.

To define a fallback font:

1. In the DSM web view, open your legacy design system.
2. In the left-hand navigation, click Fonts.
3. Hover over a font and click the ••• (more) icon.
4. Click Define fallback fonts.
5. Type the name of the font that you prefer as a fallback.
6. Click Save.

Change font family

When accessing your library via the DSM web view, you 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.

You can fix this by changing the font family in the DSM web view. 

Remove font family 

At any time, you can remove a font family from the Fonts section:

1. In the DSM web view, open your legacy design system.
2. In the left-hand navigation, click Fonts.
3. Hover over a font and click the ••• (more) icon.
4. Click Remove font family.
5. To confirm, click Delete.