# Custom login theme: image not showing in non master realm

**URL:** <https://forum.keycloak.org/t/custom-login-theme-image-not-showing-in-non-master-realm/27770>\
**Category:** Getting advice\
**Tags:** themes\
**Created:** [September 6, 2024, 11:17am UTC](https://forum.keycloak.org/t/custom-login-theme-image-not-showing-in-non-master-realm/27770 "2024-09-06T11:17:14Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![dams666](https://yyz2.discourse-cdn.com/free1/user_avatar/forum.keycloak.org/dams666/32/10872_2.png) [@dams666](https://forum.keycloak.org/u/dams666)\
**Post date:** [September 6, 2024, 11:17am UTC](https://forum.keycloak.org/t/custom-login-theme-image-not-showing-in-non-master-realm/27770/1 "2024-09-06T11:17:14Z")

</div>

Following [the developer documentation](https://www.keycloak.org/docs/25.0.4/server_development/#adding-an-image-to-a-theme), I’ve created a custom login theme that extends keycloak theme. It contains an image folder under /resources.

The image appears when the theme is applied on the master realm, but disappears when I apply it on another realm

Keycloak version: 23.0.6

theme.properties:

```auto
parent=keycloak
styles=css/login.css css/custom-login.css

```

custom-login.css:

```auto
.login-pf body {
    background: #eef2fb none;
}

div.kc-logo-text {
    background-image: url(../img/custom-logo-sm.png);
    background-position: center center;
    background-repeat: no-repeat;
    height: 140px;
    width: 500px;
    margin: 0 auto;
}

```

---

<div class="post-metadata">

**Author:** ![dams666](https://yyz2.discourse-cdn.com/free1/user_avatar/forum.keycloak.org/dams666/32/10872_2.png) [@dams666](https://forum.keycloak.org/u/dams666)\
**Post date:** [September 12, 2024, 7:32am UTC](https://forum.keycloak.org/t/custom-login-theme-image-not-showing-in-non-master-realm/27770/2 "2024-09-12T07:32:45Z")

</div>

After digging into the code, I found that the `kc-logo-text` class only appears in the master Realm. There must be a directive somewhere in **login.ftl** , but it’s not obvious where it is located.  
Any idea ?

---

<div class="post-metadata">

**Author:** ![mbonn](https://yyz2.discourse-cdn.com/free1/user_avatar/forum.keycloak.org/mbonn/32/5755_2.png) [@mbonn](https://forum.keycloak.org/u/mbonn)\
**Post date:** [September 13, 2024, 6:37am UTC](https://forum.keycloak.org/t/custom-login-theme-image-not-showing-in-non-master-realm/27770/3 "2024-09-13T06:37:16Z")

</div>

I use

```css
.login-pf-page .login-pf-page-header {
/*stuff here*/
}

```

for the header background banner and

```css
#kc-header-wrapper {
/*stuff here*/
}

```

for the logo inside the header banner (Keycloak 24). Also switch off the browser cache when testing the theme with modified css content. And delete the content of `data/tmp/kc-gzip-cache/` in your keycloak directory after updating the css or img files.

---

<div class="post-metadata">

**Author:** ![dams666](https://yyz2.discourse-cdn.com/free1/user_avatar/forum.keycloak.org/dams666/32/10872_2.png) [@dams666](https://forum.keycloak.org/u/dams666)\
**Post date:** [September 27, 2024, 9:53am UTC](https://forum.keycloak.org/t/custom-login-theme-image-not-showing-in-non-master-realm/27770/4 "2024-09-27T09:53:00Z")

</div>

It works like a charm thx !

```auto

.login-pf body {
    background: #eef2fb none;
}

/* remove logo in the master realm div */
div.kc-logo-text {
    background-image: none;
}

/* add your logo everywhere */

#kc-header-wrapper {
    background-image: url(../img/<your logo>);
    background-position: center center;
    background-size:contain;
    background-repeat: no-repeat;
    font-size: 0; /* remove realm name text */
    height: 260px;
}

```
