Font Size:
Ask Joget AI

Plugin UI Customisation Guide for OEM Builds

Adding Custom Stylesheet to OEM Build

  1. Download the ai-designer-oem-customisation.css in the package.
  2. Add it to oem-enterpriseweb/src/main/webapp/css.

Change the GenAI plugin Header

Edit the genai-ui.css with your custom styling. In the genai-ui.css, there is a sample style to change the header and add a logo to the header.

The end result will look like the following:

Include the Custom Stylesheet in App Center

  1. Edit the app center in UI Builder
  2. Click Settings.
  3. Go to Custom CSS under the theme's Advanced settings.
  4. Add the following line to Custom CSS to import the genai-ui.css stylesheet.

@import url("#request.baseURL?html#/css/ai-designer-oem-customisation.css?build=#platform.build?html#");

Include the Custom Stylesheet in the Admin Console

  1. Edit the console_custom.css under oem-enterpriseweb/src/main/webapp/css.
  2. Add @import url("ai-designer-oem-customisation.css"); in the stylesheet.
Created by Debanraj Ravindran Last modified by Debanraj Ravindran on Apr 24, 2026