Unraid Themer

Beta Plugin for Unraid 7

Restyle the Unraid 7 webGUI.

Pick a theme or build your own, flip it on, and the whole interface restyles: the classic Dynamix pages and the new Vue web components. Swap the UI icons for open-source icon sets, or override single icons.

Install Source on GitHub

Unraid 7.0.0 or later · Listed in Community Applications · MIT

The Unraid 7.3 dashboard restyled with the Nord theme and the Lucide icon set
Unraid 7.3 dashboard with the Nord theme and the Lucide icon set.

Themes

Twenty themes in the store. Or your own.

Bundled presets plus a built-in theme store you browse and download from on demand, with search and a light/dark filter. Every theme is validated before it is saved. On Apply the plugin pairs the Dynamix base: dark themes switch to Black or Gray, light themes to White or Azure, so the Vue components and Community Apps render in the right mode.

Palettes as listed in the theme registry, themes/index.json: background, surface, text, accent, accent 2. The plugin shows the same strip next to every theme in the store and the preset dropdown.

The theme store on the Unraid Themer settings page, listing bebamu, Nord, Dracula, Solarized Dark, Monokai and Gruvbox Dark with Get and Uninstall buttons
The theme store inside the plugin: search, light/dark filter, get and uninstall.

Theme builder

Eight colors and an optional font.

Build a theme from eight colors, by swatch or as hex/rgb, previewed live and saved as a preset. A live WCAG contrast readout covers the pairs that carry text, and the button label color is chosen for you so it stays readable on any accent. Optional bundled webfonts, served locally: Inter, Roboto, Source Sans 3, JetBrains Mono, Nunito, Comic Neue.

The theme builder: eight color fields for background, surface, header, text, muted text, border, accent and accent 2, plus mode, font, name and a Build and Apply button
The builder starts from the current theme, here Nord.

Want it in the store? See THEMES.md and the annotated themes/_template.css, then open a pull request. A GitHub Action validates every theme before it can be listed.

Icons

Nine open-source icon sets.

One switch swaps every UI glyph for a line set that tints with the theme. For finer control, the Themer Icons page lists every slot with a live preview: pick from a searchable grid of all bundled sets, paste an SVG URL, or upload your own SVG. Everything is validated, and a single icon resets to the set default with one click.

Lucide
Tabler
Phosphor
Heroicons
Iconoir
Remix
Bootstrap
Carbon
Material Symbols

Rendered from the SVG files that ship with the plugin. Lucide (ISC); Tabler, Phosphor, Heroicons, Iconoir, Bootstrap Icons (MIT); Remix Icon, Carbon, Material Symbols (Apache-2.0).

The Themer Icons page: one row per icon slot with the current glyph, a grid picker button, an upload button and a text field
Themer Icons: override any slot.
The icon grid picker searching for download, with matching glyphs grouped by Lucide, Bootstrap, Carbon, Heroicons, Iconoir and Material Symbols
The grid picker searches every bundled set at once.

Also in the box

The rest of the interface, too.

Whole-UI coverage
Classic Dynamix pages, the Vue header (bell, menu, toolbar), Community Apps, tables, dashboard and the Settings icons.
Background image
By URL (cached locally, CSP-safe) or a file on the server through Unraid's file picker, with a dim slider for legibility.
Custom logo
Replace the Unraid wordmark in the header with your own logo, by URL or a file on the server.
Sidebar layouts
Azure and Gray are supported; the base pairing keeps you in your layout family.
Non-destructive
Disable it and the webGUI is 100% stock. Semantic status colors such as disk health and array state are deliberately left untouched.
Self-contained
One .plg, no external runtime dependencies. Config lives on the flash drive and survives reboots.

Install

Three steps, then a hard reload.

  1. Community Applications

    Open the Apps tab on your server, search for Unraid Themer and install it.

  2. Or install by URL

    Plugins → Install Plugin, paste:

    https://github.com/benjaminmue/unraid-themer/raw/refs/heads/main/unraid-themer.plg

  3. Turn it on

    Open Settings → Utilities → Unraid Themer, set Enable to Yes, pick a theme, Apply, then hard-reload the browser (Cmd/Ctrl+Shift+R).

Beta channel

New features land on the beta branch first. The branch a .plg is built from is its update channel, so an installed beta keeps updating from beta and never crosses over to stable. Install it the same way; it replaces the stable build in place. Your settings live on the flash drive and survive the switch in both directions. Beta versions carry a bNN suffix.

https://github.com/benjaminmue/unraid-themer/raw/refs/heads/beta/unraid-themer.plg

This is a beta. Testing and contributions are very welcome. Found a glitch or have an idea? Open an issue or start a discussion.

How it works

Unraid 7 has no global CSS hook, but a .page with Menu="Buttons" runs inside <head> on every page. Unraid Themer uses that to inject the active theme, icon set and your overrides, only when enabled. Themes restyle through :root custom-property overrides, which inherit through the open shadow DOM of the Vue web components, so the new UI recolors too.

Built with AI

The plugin was written largely by an AI assistant (Claude Code by Anthropic), directed, reviewed and tested on real hardware by @benjaminmue on his own Unraid 7.3 server. Read the code before trusting it on yours; issues and pull requests are welcome.

Inspired by WuSiYu/unraid-custom-css (the injection mechanism) and Skitals/unraid-theme-engine (the discontinued Theme Engine).