Custom Font List
The Slides text editor uses Univer’s shared font list for its font-family dropdown. Configure that application-level list on UniverUIPlugin.
Configure font choices
TypeScript
import { FontCategory, UniverUIPlugin } from '@univerjs/ui'univer.registerPlugin(UniverUIPlugin, { container: 'app', customFontFamily: { list: [ { value: 'Inter', label: 'Inter', category: FontCategory.SANS_SERIF, }, { value: 'Noto Serif', label: 'Noto Serif', category: FontCategory.SERIF, }, ], override: false, },})value is written as the text run’s font family. label is the displayed text or an i18n key, and category optionally groups the choice.
Load each browser font yourself with @font-face or a stylesheet. Adding a name to the list does not download a font file; if the family is unavailable, the browser uses a fallback.
Facade API
After the UI Facade has loaded, append font choices at runtime with addFonts:
TypeScript
import { FontCategory } from '@univerjs/ui'univerAPI.addFonts([ { value: 'Inter', label: 'Inter', category: FontCategory.SANS_SERIF, },])This updates the shared dropdown immediately and does not load the corresponding font bytes.
How is this guide?