Blog Posts
Branding Apache Guacamole

Branding Apache Guacamole

May 3, 2026·Tyler Rasmussen
Tyler Rasmussen

Gacuamole

Apache Guacamole while wonderful, doesn’t have an easy method to modify how it looks. To work-around this, a number of great folks have created extensions that overwrite the underlying CSS. In this blogpost were going to take one of these extensions created by Zer0CoolX, modify it to our liking, and tell Guacamole to load it on start up.

Download Extension

Download the extension using wget.

wget https://github.com/Zer0CoolX/guacamole-customize-loginscreen-extension/raw/master/branding.jar

Extract the contents of the file using unzip. On Windows, you can use the 7-Zip Manager to view, download and re-upload the files from/to the .jar file.

unzip branding.jar

drwxr-xr-x    - tyler 21 Jan  2017  css
drwxr-xr-x    - tyler 21 Jan  2017  images
drwxr-xr-x    - tyler 21 Jan  2017  translations

Update Branding

To update the logo, replace the file located at .\images. If you change the name of the file, ensure its updated in guac-manifest.json and .\css\login-override.css.

.\images\logo-placeholder.png

For the theming itself, update the CSS located under .\css\login-override.css.

vim .\css\login-override.css

Here is an example with all of the green hightlighting replaced by a greyish blue.

.login-ui .login-dialog .logo {
    background-image: url('app/ext/tempnamespace/images/logo-placeholder.png');
	width: 9em;
	-webkit-background-size: 9em auto;
}
div.login-ui {
	background: white;
	background-color: white;
}
.login-ui .login-dialog {
	background-color: white;
}

/* Home */
.recent-connections .connection:hover {
    background-color: #DCE0E4;
}

.menu-dropdown .menu-contents li a:hover {
    background-color: #DCE0E4;
}

.list-item.selected {
    background: #DCE0E4
}
.list-item:not(.selected) .caption:hover {
    background-color: #DCE0E4;
}

/* Connection */
#connection-warning {
    background-color: #DCE0E4;
}

/* Settings */
.page-tabs .page-list li a[href]:hover,
.section-tabs li a:hover {
    background-color: #DCE0E4;
}
.settings table.session-list tr.session:hover {
    background-color: #DCE0E4;
}

#filesystem-menu .header.breadcrumbs .breadcrumb:hover {
    background-color: #DCE0E4;
}

#guac-menu #zoom-out:hover,
#guac-menu #zoom-in:hover {
    background-color: #DCE0E4;
}

When satisfied with your modifications, re-zip the file.

zip -r branding.jar *

Install Extension

Local Install

Copy the extension into the extensions directory and restart Apache Guacamole.

cp branding.jar /etc/guacamole/extensions/
sudo systemctl restart tomcat

Docker Container

If running Guacamole via a Docker container, a little more work is required.

  1. Add a volume to your docker container for /guac-home.
volumes:
  guacamole_home:

  guacamole:
    image: guacamole/guacamole:1.6.0
    ...
    volumes:
      - guacamole_home:/guac-home
  1. Next, we’ll use a temporary Alpine container to mount the guac-home volume, copy in the branding.jar file.
sudo docker run --rm -v container_name:/guac-home -v ./path/to/branding.jar:/branding.jar alpine sh -c "mkdir -p /guac-home/extensions && cp /branding.jar /guac-home/extensions/"
  1. Lastly, redeploy the guacamole container.
docker compose up -d

You’re change should now be visible on Gaucamole.

Annual to Monthly Billing w/ 1Password