[Guide] Set a custom image for the Player Portal

Last updated: April 24, 2026

  • You will need an image in SVG format.

  • You will need two files called logoSocial.svg and logoPortal.svg.

  • If the icons are being resized in the portal, please set the height in the SVG file by using xml:space="preserve" style="height:<INSERT_HEIGHT_HERE>px"

To use custom icons in the Social Portal, you need to tell the portal where to find the new icon directory, then package and run the portal locally.

1. Add the icon directory to default.js

Open:

pragma-engine/platform/<game-name>/portal/src/config/default.js

Find the portal config near line 25 and add your new icon directory:

'assets.iconDirs': ['icons/example'],

In this example, the directory is called example.

2. Add the icon files

Place the new icons in:

pragma-engine/platform/<game-name>/portal/src/assets/icons/example

The folder name should match the directory you added in default.js.

3. Point Social Portal to your project portal build

Update your Social config so that the Portal plugin uses your project’s Social Portal build:

social:
  core:
  serviceConfigs:
  pluginConfigs:
    SocialPlayerGatewayNodeService.routePlugins:
      plugins:
        Portal:
          class: "pragma.gateway.FilePortalModulePlugin"
          config:
            portalSource: "<game-name>/portal/dist/player-social"

Replace <game-name> with your game/project name.

4. Package the portal

From bash, run:

./pragma portal package

5. Start Pragma

Start Pragma using either:

./pragma start

Or start it from IntelliJ.

6. Confirm the icon appears

Open the local portal:

http://127.0.0.1:11000/

Confirm the new icon is available in the Social Portal.