Skip to main content

Filebrowser Custom Icon Colors - How To

This css colorizes some file types' icons, so different files can be distinguished more easily. It also changes some icons to make distinguishing them even more easy.

lq11cu3y5r581.png

How to use this

  • Download the custom.css file from here
  • In Filebrowser, go to Settings → Global Settings and enter the path to where you saved the custom.css in "Branding Directory path"

You can also set this on the commandline.

Since no one else showed exactly how to do this, I will be kind and explain it for you. Since I am using a docker image of Filebrowser, it uses the 'srv' directory as the volume mount for the file directory.

filebrowser-docker-compose.png

I created a new folder in my root Filebrowser called custom then placed the custom.ss file there.

filebrowser-custom-branding-dir-gif.gif

It's important to leave the trailing slash so the path can call and append the custom.css file.

filebrowser-custom-branding-dir.png

Once you save this path, you might need to clear your browser cache to see the changes.

Back to top