Appearance & Theme Colours
The Appearance screen lets the platform owner recolour the entire WaDesk dashboard — both the customer-facing user panel and the admin panel — to match a brand palette, without editing a single line of code. It was introduced in WaDesk v1.2 and lives at Admin → Appearance (/admin/appearance).
What it is
Appearance is a no-code theming control. Instead of asking a developer to recompile stylesheets, you choose colour values on a single page and WaDesk applies them across every screen of the platform instantly.
- It recolours the whole dashboard — the user panel that your customers log into and the admin panel you manage from.
- It works on top of the design tokens the interface is built from, so the new colours flow through buttons, links, highlights, surfaces, and accents consistently.
- It is a true white-label tool: point the palette at a client's brand colours and the panel looks like the client's own product.
Why and when to use it
Use Appearance whenever the default WaDesk colours are not the look you want to present.
- White-labelling for a client — match the dashboard to an agency or reseller client's brand palette so the platform feels native to them.
- Brand consistency — align the panel with your company's primary and accent colours.
- Seasonal or campaign refresh — quickly shift the palette and revert later, since a Reset button restores the shipped defaults.
Tip: Appearance controls the application colours. The colours of your public marketing website are edited separately in the Frontend Live Editor, and a workspace's own logo and branding are set per workspace — not here.
How it works
The page presents the theme's design tokens as a set of colour fields — the primary and accent colours, surface and background colours, and so on. You pick a value for each token you want to change.
When you save, the values are stored in the platform's system settings under the theme.color.* keys. From then on, WaDesk injects those values as live CSS variables into every page, across every theme and skin the interface ships with. Because the colours are applied as variables rather than hard-coded, the change takes effect immediately and platform-wide — there is no rebuild and no per-page editing.
| Element | Behaviour |
|---|---|
| Design-token fields | Each field maps to one colour token used throughout the interface (primary, accent, surfaces, and more). |
| Stored as | System settings under theme.color.*. |
| Applied as | Live CSS variables injected into every theme/skin, on both the user and admin panels. |
| Scope | Platform-wide and instant — the moment you save, every screen reflects the new palette. |
| Reset | A Reset button restores the original shipped default colours. |
Step by step
- Open Admin → Appearance (
/admin/appearance). - For each design token you want to change, pick a colour value — start with the primary and accent colours, which have the broadest visible effect.
- Adjust the surface and background tokens if you want to change the panel's overall tone.
- Save. The new palette is written to
theme.color.*and applied live across the user and admin panels right away. - If you want to start over, click Reset to return every token to its shipped default.
Caution: Because the change is platform-wide and instant, picking colours with too little contrast can make text hard to read for every user at once. Choose accessible combinations, and use Reset if a palette does not work out.
Where to find it
The control is in the admin sidebar under Appearance, reachable directly at /admin/appearance. It is distinct from two nearby tools that are easy to confuse with it:
- The Frontend Live Editor controls the public marketing site's content and colours, not the dashboard.
- Per-workspace branding (logo and workspace identity) is configured for each workspace and does not change the platform palette.
Plan & permissions
Appearance is a platform-admin-only tool. It is not exposed to ordinary workspace users, and the palette it sets is global — it applies to everyone using the platform, not to a single workspace.
Related Pages
- Auth Page Editor — restyle the public Login, Register, and Forgot Password pages.
- Frontend Live Editor — edit the public marketing site's text, colours, and sections.
- System Settings — where platform-wide settings (including
theme.color.*) are stored.