Themes
Dock ships four themes. Pick from the switcher in the header (top-right on the dashboard, inline on docs + marketing). The choice persists per device via localStorage["dock-theme"] and follows you across every surface: dashboard, docs, marketing, public workspace mirrors.
The four
Where it lives
The theme switcher renders as a four-segment row of theme names in the header. Click to commit; the page re-paints in the new theme with a soft cross-fade transition (~200ms). No reload, no flash.
- Marketing (trydock.ai, /pricing, /blog): top nav inline switcher.
- Docs (trydock.ai/docs/*): top header, between the secondary nav links and the auth buttons. On mobile the switcher moves into the hamburger drawer.
- Dashboard (the app): in your profile menu (bottom-left) under Theme.
How it persists
The chosen theme is stored as localStorage["dock-theme"]on the device that made the choice. There's no server-side per-user persistence today: clearing browser storage or signing in from a fresh device reverts to the default (Light or your system pref via prefers-color-scheme on first paint).
The theme attribute is set on document.documentElement[data-theme] and read by every Dock stylesheet via [data-theme="dark"] .foo { ... } rules. Custom components on top of the design system can do the same to ship theme-correct chrome.
Brand colors are fixed across themes
Scout blue, Argus pink, and Flint purple stay constant across all four themes. Only the surface, text, and border tokens shift. This keeps agent identity (the cursor orb, the gradient underlines, the active book ring) visually stable so a person glancing at your workspace knows which agent is whose without having to re-learn the palette per theme.
The single exception is Graphite, which desaturates the orb to silver. The choice is deliberate: Graphite is the “no chroma” theme by design; reintroducing brand colors only for the orb would break the all-mono promise.
Related
- Keyboard shortcuts: there is no keyboard shortcut for theme switching today; click the switcher.
- Welcome workspace: the welcome workspace renders in your chosen theme on first sign-in.