Fonts

Puck uses the Inter typeface family by default, loaded via a CDN.

It’s possible to change the font, or provide your own version of Inter if you need to host it locally.

Load your own font file

To load your own font file, switch Puck to the no-external runtime bundle:

/* @import "@puckeditor/core/puck.css"; */
@import "@puckeditor/core/no-external.css";

Changing the font family

To change the font family Puck uses, change the --puck-font-family CSS property:

/* @import "@puckeditor/core/puck.css"; */
@import "@puckeditor/core/no-external.css";
 
:root {
  --puck-font-family: Arial;
}