Skip to main content

Basics

Standards offers a small catalog of fonts available to choose from out of the box, as well as the ability to upload custom fonts for your specific brand.

Supported font formats

  • .woff (preferred)
  • .woff2 (preferred)
  • .otf
  • .ttf

Uploading fonts

There are various ways to upload font files, and all of these methods can be utilized to best fit your workflow:
  • Upload fonts during setup to create styles to use in your guideline based on an outline
  • Upload fonts by simply dragging and dropping the font files into the editor of the project
  • Select the Files tab then the Upload button to select font files to upload
  • Within the text settings group, add font files from the family or weight dropdown

Font data

Uploaded font files typically have correct font data by default, but sometimes there are errors that need correcting. Font data enables browsers to correctly display the font on the web. View and edit font data by selecting the font file from the Files tab in the right sidebar to open the file detail panel.
1

Select font file

From the Files tab in the right sidebar to open the file detail panel
2

Edit font data

Fromt he font file detail panel, edit or change the font data from the family and subfamily settings groups

Example of correct font data

SettingValueDescription
FamilyHelveticaThis is the font grouping
SubfamilyBoldThis is the font weight shown in the weight dropdown and sometimes used in text decoration
Weight600 (Bold)This is the weight the browser uses
StyleObliqueThis is where font styling like italics or oblique are set

Example of incorrect font data

SettingValueDescription
FamilyHelveticaBoldObliqError: File name being used as family
SubfamilyNoneError: Font subfamily must be set
Weight300 (Normal)Error: Weight will most likely not match the actual weight
StyleNoneError: Needs to be set if font is italic or oblique

Using a different weight for bold text decoration

Sometimes it’s desirable for the ‘bold’ text decoration applied to certain words in a block of text to use a different weight than the font’s bold. For example, heavy or medium may be a better fit. This can be achieved by editing the font data:
1

Select the font file

From the Files tab select the font file with the weight you would like to display as bold when used as text decoration.
2

Edit the font data

From the file detail panel, under Subfamily, change the weight from the dropdown to Bold (even if the font is medium or extrabold, or another weight)
3

Test the change

Now, select text that uses that font family, highlight a word, and select the bold option from the contextual toolbar.

Google fonts

Google fonts are open source and may be freely used anywhere on the web, including Standards. However, Google fonts must first be downloaded locally as a supported font file format, then uploaded directly to Standards.

Adobe fonts (and other services)

Currently we do not support online type activation services such as Adobe Fonts. Standards requires the reading of font metrics to allow for precise text alignment and control, which means uploading your font files. With most branding projects, your client will be required to purchase a font license regardless, so if using Adobe Fonts or a similar service, we recommend purchasing licenses and uploading the font files.