Appearance
Switch between light and dark modes, and pick an accent colour palette. Your choice applies immediately and persists across sessions. Palette selection requires a paid plan (Starter or above).
Accessing appearance settings
Go to Settings → Appearance in the sidebar.
Colour mode
| Option | Behaviour |
|---|---|
| Light | Always show light mode |
| Dark | Always show dark mode |
| System | Match your operating system setting |
Changes take effect instantly — no page reload required.
Colour palettes
Five built-in palettes, each with a distinct character:
| Palette | Description |
|---|---|
| Ink | Deep indigo-ink. Default. |
| Navy | Institutional navy. |
| Forest | Deep forest green. |
| Oxblood | Burgundy, traditional finance feel. |
| Ochre | Warm amber. |
Selecting a palette changes the primary colour used for buttons, links, navigation indicators, and other interactive elements throughout the app.
Free-tier users see an “Upgrade to Starter” message instead of the theme picker.
Custom palette (Growth and Enterprise plans)
On Growth or Enterprise, a Custom palette option becomes available. Define three colours:
- Foreground — primary text colour.
- Background — page background colour.
- Primary — accent for buttons and interactive elements.
Enter hex values; WealthMgr converts them to OKLch colour space internally. Other shades are derived automatically. Changes preview in real time.
How theming works
Colours derive at runtime from OKLch colour space using the culori library. CSS custom properties update as you select a new palette. Your preferences live in the local configuration store and restore on every page load.