Custom colour themes (define your own theme for light and dark mode
What would you like to change?
Problem
We run Kaneo self-hosted and want it to look like our company colors, fonts and shapes, in both light and dark mode. Kaneo has no theme setting today, so we inject our own stylesheet through a reverse proxy (nginx sub_filter adds a before ). That stylesheet (~400 lines) overrides the shadcn CSS variables (--background, --foreground, --card, --primary, --accent, --muted, --border, --ring, --sidebar-, --chart-) and adds rules for cards, columns, labels and buttons. It works, but it depends on Kaneo's internal variable names, class names and markup, so every release can silently break it. We run a smoke test after each update to catch that.
Proposal: let users define their own theme
- A theme is a named set of colour tokens with a light and a dark variant: at least background, foreground, card, popover, primary, secondary, accent, muted, border, input, ring, destructive, sidebar, chart colours, and the column/card surfaces of the board.
- Optional theme values beyond colour: font families (heading and body), border radius, and shadow strength.
- Ways to set it:
- in the UI for an instance admin (and optionally per workspace), with a live preview and presets;
- by importing/exporting a theme file (JSON or CSS custom properties), so a theme can be versioned in git and reused across instances;
- optionally via environment variable or a mounted file for self-hosted setups (e.g. KANEO_THEME_FILE).
- The theme is applied with scoped rules (html:not(.dark) and html.dark), so the light/dark toggle keeps working.
- Labels use their colour on the card: a tinted label pill (label colour at ~20% over the card, stronger border) instead of only a small dot. With one label per epic (25 per project) the dot is too small to tell labels apart.
- The token names are treated as a stable, documented interface, so custom themes survive upgrades.
Context
Self-hosted Kaneo 2.33.0 (Docker, PostgreSQL 16). Our current workaround: reverse proxy plus an override stylesheet, and label tints via CSS :has() selectors on the label dot's inline style. A built-in theme feature would let us remove all of that.
Additional context
No response
Originally requested by @JeffreyNL on 2026-10-06. Original GitHub request #1954.