JBoss.orgCommunity Documentation

Chapter 9. Themes

9.1. Configure theme
9.2. Default themes
9.3. Creating a theme
9.3.1. Stylesheets
9.3.2.
9.3.3. Images
9.3.4. Messages
9.3.5. Modifying HTML
9.4. SPIs
9.4.1. Theme SPI
9.4.2. Account SPI
9.4.3. Login SPI

Keycloak provides theme support for login forms and account management. This allows customizing the look and feel of end-user facing pages so they can be integrated with your brand and applications.

To configure the theme used by a realm open the Keycloak Admin Console, select your realm from the drop-down box in the top left corner. In the Optional Settings use the drop-down boxes for Login Theme and Account Theme to select the theme used by login forms and account management pages.

Keycloak comes bundled with default themes in standalone/configuration/themes. It is not recommended to edit these themes directly. Instead you should create a new theme to extend a default theme. A good reference is to copy the keycloak themes as these extend the base theme to add styling.

There are several types of themes in Keycloak:

  • Account - Account management
  • Admin - Admin console
  • Common - Shared resources for themes
  • Email - Emails
  • Login - Login forms

A theme consists of:

  • FreeMarker templates

  • Stylesheets

  • Scripts

  • Images

  • Message bundles

  • Theme properties

A theme can extend another theme. When extending a theme you can override individual files (templates, stylesheets, etc.). The recommended way to create a theme is to extend the base theme. The base theme provides templates and a default message bundle. It should be possible to achieve the customization required by styling these templates.

To create a new theme, create a folder in .../standalone/configuration/themes/< theme type>. The name of the folder is the name of the theme. Then create a file theme.properties inside the theme folder. The contents of the file should be:

parent=base

You have now created your theme. Check that it works by configuring it for a realm. It should look the same as the base theme as you've not added anything to it yet. The next sections will describe how to modify the theme.

For full control of login forms and account management Keycloak provides a number of SPIs.