Skip to content

Branding & Theming ​

Branding (administrator only) lets you make the panel your own: name, logos, login page, and the color theme. 5Stack has a single dark theme, so every color you set applies everywhere.

Find it under Settings → Application → Branding. Color changes preview live, and nothing is saved until you press Save changes in the Unsaved changes bar that appears.

General ​

  • Brand Name: shown in the sidebar and the page title.
  • Border Radius: global corner rounding for buttons, cards and inputs (0–1.5rem).
  • Show Separators: toggle the divider lines between sections.

Logo & Favicon ​

  • Logo: one square image (512×512 PNG recommended; PNG, JPEG, SVG or WebP). It's used across the app and to generate your PWA install icon.
  • Favicon: optional, a simpler mark for the browser tab (PNG, JPEG, ICO or WebP).

Each has a preview and a remove button.

Login Page ​

  • Show Login Footer: toggle.
  • Footer Text and Footer URL.

Theme Colors ​

  • Core: background, foreground, primary, secondary, accent, muted, destructive, warning, each with its foreground.
  • Cards & Borders: card, border, popover, input, focus ring.
  • Sidebar: background, text, active/hover, border, primary, focus ring.
  • Top Nav: background, text, hover, border, primary, focus ring.
  • Tactical: the Tactical Accent (amber highlights), used for highlights, live indicators, the open app on the hub dock, and your team in a match's header and stat tables.

There is no light mode

5Stack used to carry a light palette that nothing displayed. It was removed, so there's one set of colors to brand rather than two.

Saving & sharing themes ​

  • Export Theme to a JSON file and Import Theme from one, handy for moving a look between instances or sharing it.
  • Reset to Defaults clears your brand name, colors, login footer, and uploaded logo and favicon, restoring the default 5Stack theme. It can't be undone.