Six variable fonts are bundled and registered automatically. Use them by name in
font_family.
| Name | Style |
|---|
inter | sans |
geist | sans |
geist-mono | monospace |
nunito-sans | sans |
roboto | sans |
source-serif-4 | serif |
{ type: "paragraph", text: "Body text", style: { font_family: "source-serif-4" } }
Weights
font_weight selects a real weight by instancing the variable font at build time. Names map
to the usual axis values, and numbers pass straight through.
| Name | Number |
|---|
thin | 100 |
extralight | 200 |
light | 300 |
regular | 400 |
medium | 500 |
semibold | 600 |
bold | 700 |
extrabold | 800 |
black | 900 |
{ type: "paragraph", text: "Heavy", style: { font_family: "inter", font_weight: "black" } }
{ type: "paragraph", text: "Light", style: { font_family: "inter", font_weight: 300 } }
**bold** and the strong inline node also produce a real bold weight. See
Inline content.
The bundled fonts are upright only, with no italic axis, so em and *italic* render the
same glyphs as regular text. Use strong, **bold**, or a heavier font_weight for
emphasis that is visible.
Custom variable fonts
Load a custom variable font with load_font and pass variable: true to enable weight
instancing. Then use the registered name in font_family.
doc.load_font("my-sans", "./fonts/MySans.ttf", true);
doc.page().content(
{ type: "paragraph", text: "Custom font", style: { font_family: "my-sans", font_weight: "semibold" } },
);
