This concept page explains how to set the color theme used in the UI throughout the whole Fonto Editor.

The theme-name configuration value is used to set the theme. It can have one of the following values:

  • fontoBlue - colors chosen to match Fonto's blue branding.

  • neutral - colors chosen to embed Fonto in existing pages.

This value always defaults to neutral. You can configure the editor to use fontoBlue instead, though this is not recommended.

Set the theme-name configuration variable

Create the file "config/configuration.js" in your editor and add the following code to set the theme.



import configurationManager from 'fontoxml-configuration/src/configurationManager.js';

configurationManager.set('theme-name', 'neutral'); // or configurationManager.set('theme-name', 'fontoBlue');

Final result

  • Using neutral theme:

  • Using fontoBlue: