Typography Specification

Every design system needs to define the fonts it uses and how it uses them. In this example we are using the Google 'Inter' font. It has been designed to use mostly thinner versions, as defined in the Font Weights section. Wherever possible I like to show the CSS for anything being defined globally for the site.

This would typically be a page in the design system. The example below is a screenshot of a sample typography spec.