Figma plugin UI font family

I am developing a plugin for Figma, and I have been trying to modify the default font family that the UI uses by default, however, any attempt to force a custom font via CSS did not work.

I am starting to wonder if this is really possible.

So for trying to change the font family, in the ui.html file, in the section, I have something like the code below. I have my font file in a folder named “fonts” inside the plugin folder.

@font-face {
      font-family: 'myExampleFont-Regular';
      src: url('./fonts/myExampleFont-Regular.otf');
      font-style: normal;
      font-weight: 400;
}
.someSpanClassElement{
      ....bla
      bla
      bla...
      font-family: 'myExampleFont-Regular';      
}

Any tips, or confirmation that changing plugin UI font-family is not possible will be much appreciated.

Your font must be on the Internet and be available via a link. So use Google Fonts or some other service, or upload the font to your site and link directly to the font in your CSS.

Thanks for your answer but this is not possible since this is a a private company-developed font…so unless Figma is able to fetch it from a private company server…getting it from the internet is not an option.

Still, it should be able to fetch if from local, feels a bit weird if not.

Unfortunately, there is no other way. Plugins can only contain these 3 files:

  • manifest.json
  • code.js
  • ui.html

Images, fonts, scripts and other resources can only be connected by URL.

Good to know, very limited functionality from a developer point of view, but still good to know.

Thanks again for your answer.