Skip to content
This plugin is new and currently in beta. For the stable version, please use the previous version of the plugin.

CustomFontFamily

Interface defining custom font family configuration for the Stripo Email Editor Extensions SDK.

typescript
interface CustomFontFamily

Description

The CustomFontFamily interface specifies the structure for adding custom fonts to the Stripo Email Editor. It allows extensions to register brand-specific or custom fonts that become available throughout the editor, including in font selection dropdowns and for use in email templates.

Import

typescript
import { CustomFontFamily } from '@stripoinc/ui-editor-extensions';

Properties

name

Display name of the font family shown in the editor's font selector.

typescript
name: string

Type

string

Usage Notes

  • This is the human-readable name displayed to users
  • Should be descriptive and recognizable
  • Appears in all font family selection dropdowns
  • Can include spaces and special characters

Example

typescript
{
    name: 'Proxima Nova'
}

fontFamily

CSS font-family declaration used in the document's HTML/CSS.

typescript
fontFamily: string

Type

string

Usage Notes

  • Must be a valid CSS font-family value
  • Can include fallback fonts
  • This value is directly inserted into CSS rules
  • Should follow standard CSS font-family syntax

Example

typescript
{
    fontFamily: '"Proxima Nova", "Helvetica Neue", Helvetica, Arial, sans-serif'
}

url

URL pointing to the font file or CSS file containing @font-face declarations.

typescript
url: string

Type

string

Usage Notes

  • Can be an absolute URL to external font services
  • Can be a relative URL to self-hosted fonts
  • Typically points to a CSS file with @font-face rules
  • The CSS is automatically loaded when the font is registered
  • Supports Google Fonts, Adobe Fonts, or custom font hosting

Example

typescript
{
    url: 'https://fonts.googleapis.com/css2?family=Proxima+Nova:wght@400;700'
}