Per-Server Visual Identity (Accent Colors, Dynamic Favicons and Tab Titles)

SYSTEM INFORMATION
OS type and version Ubuntu Linux 22.04.5
Webmin version 2.670
Usermin version 2.570
Virtualmin version 8.3.0 GPL
Theme version 26.70
Apache version 2.4.52
Package updates All installed packages are up to date
Hi,

When managing multiple Webmin/Virtualmin servers, it’s not always easy to distinguish between browser tabs, especially when every server uses the same Authentic Theme appearance.

Currently, the Hue and Saturation filters in Theme Configuration can be used to give each server a different look. While this works, I think a simpler and more integrated approach would be useful.

I’d like to suggest a per-server visual identity feature that brings a few related customization options together.

1. Accent Color Picker

Allow administrators to choose a custom accent color using a color picker or HEX value, without having to adjust hue and saturation filters.

The selected color could be applied consistently to navigation elements, active menu items, buttons, and other appropriate interface accents while preserving the overall light or dark theme.

2. Dynamic, Color-Matched Favicon

Add an option to automatically generate or recolor the default favicon based on the selected accent color.

This would make it much easier to identify different servers directly from browser tabs.

Existing custom favicon functionality should remain available and take priority when a custom icon is uploaded.

3. Custom Server Label and Browser Tab Title

Allow administrators to define an optional, recognizable server label that can appear in the navigation interface and browser tab title.

The label should be configurable independently of the system hostname.

4. Optional Environment Indicator

An optional, subtle environment indicator could help distinguish production, staging, development, or other server roles without introducing intrusive warning banners.

5. Unified Configuration

Ideally, these settings could be grouped under a single section in Theme Configuration, such as Server Identity or Visual Identity.

They should be stored per installation, persist across theme updates, and work consistently in both Webmin and Virtualmin views.

Why This Would Be Useful

This is more than a cosmetic customization feature.

For administrators managing multiple servers simultaneously, consistent visual identification would improve navigation, reduce confusion between browser tabs, and help prevent accidental changes on the wrong server.

I think this would be a practical quality-of-life improvement for Authentic Theme.

Thanks for considering it!

VSCode has an extension that does this sort of thing.

Thanks! Peacock is actually a good example of the concept I’m suggesting.

The difference is that I’d like to see something similar built directly into Authentic Theme, particularly for dark mode, with per-server accent colors, matching favicons, and optional browser tab labels.

That way, administrators could distinguish between Webmin/Virtualmin servers without relying on external tools or manually adjusting hue and saturation filters.

maybe add one more option to your suggestion. (taken from peacock :smiley: )

The colour can be automatically generated from the server’s full hostname (FQDN), this stops you having to manually set a colour and if you disable/enable this feature, the automatically generated colour will not be random.

why not change the color palette ?
it does not work with dark


change the pallette to green you get a totally different effect

or maybe white

have a play with it

to change the browser tab description use this

Thanks for pointing out the browser tab title setting. That’s useful, and I hadn’t noticed it.

Regarding the color palette, I’m specifically referring to dark mode. I don’t want to switch to a light theme or recolor the entire interface using Hue/Saturation filters.

What I’m suggesting is the ability to keep the existing dark backgrounds while choosing different accent colors for each server, ideally with matching favicons for easier identification in browser tabs.

So the request is really about more flexible dark theme customization and bringing these server identification options together in one place.

Hope that clarifies what I mean!

well if you have plenty of time on your hands why not look at add stuff to theme extensions but this should change the icon

$( document ).ready(function() {
console.log("change Icon")
$('link[rel="icon"]').attr('href','https://microsoft.com/favicon.ico');
});

if placed here

EDIT
just tested that code it was not reliable as webmin changes the icon itself from time to time, however this appears to work

$( document ).ready(function() {
setInterval(change_icon, 100);
});
function change_icon(){
	$('link[rel="icon"]').attr('href','https://microsoft.com/favicon.ico');
}