FontFamily extension

Change text font to match your document’s style and tone. Select text and apply different fonts for headers, quotes, or emphasis. Preserves perfectly through Word import/export.

OOXML Structure

<w:r>
  <w:rPr>
    <w:rFonts w:ascii="Arial" w:hAnsi="Arial"/>
  </w:rPr>
  <w:t>Text in Arial font</w:t>
</w:r>

Use case

Brand consistency - Match company typography guidelines
Document hierarchy - Different fonts for headers vs body text
Code snippets - Monospace fonts for technical content
Readability - Choose fonts optimized for screen or print

Options

Configure the extension behavior:

Array<string>

default:"['textStyle']"

Mark types to add font family support to

Attributes

Node attributes that can be set and retrieved:

FontFamilyValue

Font family for text

Commands

`setFontFamily`

Set font family

Preserves other text styling attributes

Example:

// Set to Arial
editor.commands.setFontFamily('Arial')

import { SuperDoc } from 'superdoc';
import 'superdoc/style.css';

const superdoc = new SuperDoc({
  selector: '#editor',
  document: yourFile,
  onReady: (superdoc) => {
    const editor = superdoc.activeEditor;
    // Set to Arial
    editor.commands.setFontFamily('Arial')
  },
});

Parameters:

FontFamilyValue

required

Font family to apply

`unsetFontFamily`

Remove font family

Reverts to default document font

Example:

editor.commands.unsetFontFamily()

import { SuperDoc } from 'superdoc';
import 'superdoc/style.css';

const superdoc = new SuperDoc({
  selector: '#editor',
  document: yourFile,
  onReady: (superdoc) => {
    const editor = superdoc.activeEditor;
    editor.commands.unsetFontFamily()
  },
});

Types

`FontFamilyValue`

CSS font-family string (e.g., ‘Arial’, ‘Times New Roman’, ‘sans-serif’)

Getting Started

Editor

Document Engine

AI

Solutions

Resources

FontFamily extension

OOXML Structure

Use case

Options

Attributes

Commands

`setFontFamily`

`unsetFontFamily`

Types

`FontFamilyValue`

Source code

​OOXML Structure

​Use case

​Options

​Attributes

​Commands

​setFontFamily

​unsetFontFamily

​Types

​FontFamilyValue

​Source code

OOXML Structure

Use case

Options

Attributes

Commands

`setFontFamily`

`unsetFontFamily`

Types

`FontFamilyValue`

Source code