๐ŸŽญTheme Variants

Theme variant enables you to create multiples Keycloak theme with a single codebase.

import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'
import { keycloakify } from "keycloakify/vite-plugin";

export default defineConfig({
  plugins: [
      themeName: [ "keycloakify-starter", "keycloakify-starter-variant-1" ]

This will make the theme variant appear in the Keycloak admin select input:

In your code you'll be able to load different styles basesd on the value of kcContext.themeName:

Tutorial video

Last updated