CrewBlack and white hold every colour; each Digital Worker is one of them.
Design system
One crew, two products, four themes
One system for Digital Crew's two products: Crew OS, the platform and public site, and Max, the go-to-market workspace. Same tokens, same components, same typeface. Crew OS is ink, Max is orange.
Explore
The story
Why Crew OS is ink and Max is orange, and what that means when you design.
Foundations
Colour, type, spacing, radii, glass, motion and accessibility — 102 colour tokens in four themes.
Agents
The eight Digital Crew agents with their colours and video faces, and Max's roster.
Components
131 live components and 15 showcase pages, each with guidelines, API and example.
Brand assets
Logos, icons, integration marks, illustrations, Lottie animations and map data.
Build with it
Load the system in a page, and the machine-readable files: llms.txt, manifest, tokens, types.
The crew breaks out of the ink
Mixed, every agent's colour becomes black or white; broken apart, each agent gets its own.
Pick the theme for your product
For people
- Browse by section in the sidebar, or press ⌘K / / to search.
- Switch product and light/dark in the header; every swatch and preview follows.
- Each component page has a live preview, guidelines, its API and an example.
For LLMs and agents
- llms.txt indexes every page; llms-full.txt is the whole site.
- Add
.mdto any page path for its Markdown. - manifest.json, tokens.json and index.d.ts give exact data.
About this system
Digital Crew builds AI Digital Workers: teammates that take a role, connect to your tools and ship work alongside your people. Two products share this system. Crew OS is the platform, admin and public site where people build and run their crew. Max is the go-to-market workspace (CRM, campaigns, inbox, meetings) run by the sales Digital Worker of the same name. Both are Next.js + Tailwind v4 + shadcn (new-york) apps with the same semantic token names, the same component vocabulary and the same typeface; Max's component library is the reference implementation. They differ in one decision, and the brand story below explains it: Crew OS is ink, Max is orange.
Pick the theme for the product you are building: crew-light / crew-dark for Crew OS and the marketing site, max-light / max-dark for Max. Every token name means the same thing in all four themes; only the values change.