In ActiveReportsJS Designer, you can view the list of available fonts in Font Family property of a text box. The fonts within the designer are hardcoded, therefore the fonts installed at system level are not available for designing.

Fonts available in ActiveReportsJS Designer

You can add fonts to the list of available fonts by modifying the fonts configuration (fontsConfig.json) file shipped with the designer as follows:

  1. Navigate to fontsConfig.json file:
    • For Windows: ~\AppData\Roaming\ActiveReportsJS Designer\.
    • For macOS: ~/Library/Application Support/ActivereportsJS Designer/.
    • For Linux: ~/.config/ActivereportsJS Designer/.
  2. Modify the fontsConfig.json file to add fonts as follows.
        "path": "",
        "descriptors": [
                "name": "Noto Sans CJK JP",
                "source": "NotoSansCJKjp-Regular.otf"
                "name": "Noto Serif CJK JP",
                "source": "NotoSerifCJKjp-Regular.otf"

Now, the added fonts are available to be used in reports, as shown in the Font Family property's drop down.

Fonts added in the fonts configuration showing in ActiveReportsJS Designer

The fonts described in the fontsConfig.json for designer can also be used in viewer, thereby reducing size of the code. See Fonts topic on how you can register fonts in ActiveReportsJS Viewer when you have already added the fonts in the json file.