Dockerize Keycloak 21 with a custom theme

Saurav Samantray
3 min readJun 17, 2023

What will we accomplish?

  • Dockerizing the latest Keycloak 21
  • Customize the welcome, login, and admin console page

Dockerizing Keycloak 21

  • Create a folder that will hold all our files and folder — custom-auth-service
  • Inside the custom-auth-service folder create a file called Dockerfile with the content below that will help us build our Keycloak docker image
FROM quay.io/keycloak/keycloak:21.0 as builder

# Configure a database vendor
ENV KC_DB=postgres

WORKDIR /opt/keycloak

# for demonstration purposes only, please make sure to use proper certificates in production instead
RUN keytool -genkeypair -storepass password -storetype PKCS12 -keyalg RSA -keysize 2048 -dname "CN=server" -alias server -ext "SAN:c=DNS:localhost,IP:127.0.0.1" -keystore conf/server.keystore

RUN /opt/keycloak/bin/kc.sh build

FROM quay.io/keycloak/keycloak:latest
COPY --from=builder /opt/keycloak/ /opt/keycloak/

ENTRYPOINT ["/opt/keycloak/bin/kc.sh"]
  • Create a docker-compose.yaml file that will spin up Postgres DB(Database used by Keycloak to store all data) and a Keycloak instance created from the image built from the above Dockerfile.
version: '3'

volumes:
keycloak-db-data:
driver: local

services:
postgres:
image: postgres:13.7
container_name: postgres
volumes:
- keycloak-db-data:/var/lib/postgresql/data
environment:
POSTGRES_DB: keycloak
POSTGRES_USER: my_keycloak
POSTGRES_PASSWORD: My863Keycloak
keycloak:
build: .
container_name: custom-auth-service
environment:
#Admin Credentials
KC_HOSTNAME_STRICT: 'false'
KC_HOSTNAME_STRICT_HTTPS: 'false'
KEYCLOAK_ADMIN: admin
KEYCLOAK_ADMIN_PASSWORD: MyKeycloak493
KEYCLOAK_USER: admin
KEYCLOAK_PASSWORD: MyKeycloak493
KC_DB_URL: 'jdbc:postgresql://postgres/keycloak'
KC_DB_USERNAME: my_keycloak
KC_DB_PASSWORD: My863Keycloak
KC_HEALTH_ENABLED: 'true'
KC_METRICS_ENABLED: 'true'
KC_HOSTNAME: localhost
PROXY_ADDRESS_FORWARDING: "true"
command:
- "-v start --optimized
"
ports:
- 8443:8443
- 8080:8080
depends_on:
- postgres
  • Build Keycloak image
docker-compose build
  • Start keycloak
docker-compose up

Custom Theme in a Dockerized Keycloak 21

  • Inside the custom-auth-service folder create a folder named themes. copy the my-theme folder and all its content inside the themes folder from here.
  • Update the Dockerfile to copy my-theme folder from to the image
FROM quay.io/keycloak/keycloak:21.0 as builder

# Configure a database vendor
ENV KC_DB=postgres

WORKDIR /opt/keycloak

# for demonstration purposes only, please make sure to use proper certificates in production instead
RUN keytool -genkeypair -storepass password -storetype PKCS12 -keyalg RSA -keysize 2048 -dname "CN=server" -alias server -ext "SAN:c=DNS:localhost,IP:127.0.0.1" -keystore conf/server.keystore

RUN /opt/keycloak/bin/kc.sh build

FROM quay.io/keycloak/keycloak:latest
COPY --from=builder /opt/keycloak/ /opt/keycloak/

COPY ./themes/my-theme/ /opt/keycloak/themes/my-theme

ENTRYPOINT ["/opt/keycloak/bin/kc.sh"]
  • Update the docker-compose file to set my-theme as the default theme. Add the below variable to the environment section:
KC_SPI_THEME_DEFAULT: 'my-theme'
  • Rebuild the image and start the Keycloak instance and et voilà!

Find the complete code at GitHub here.

Custom Welcome Page

Custom Login Page

Happy Coding!

--

--