One brand kit. Change it once.
Colors, type, spacing, and logos live in one kit. Bind a design to the kit and it follows along.
Studio$24/moStart
New season.
What a kit holds. The boring, important parts.
- ColorBrand palette, semantic roles, surfaces, and light and dark pairs.
- TypeFamilies, the size scale, line height, and letter spacing.
- SpaceA base unit, scale steps, layout grids, and insets.
- Radius and shadowCorners, pills, elevation steps, and blur.
- MotionDurations, easings, springs, and stagger steps.
- LogosMarks and lockups, kept with the values they sit next to.
The same values. Everywhere, even code.
Export the kit as CSS variables, or let your developer's AI tools read it through MCP.
/* Exported from your brand kit */
:root {
--color-accent: #ec4899;
--color-ink: #09090b;
--radius-card: 20px;
--space-4: 1rem;
--font-heading: "Varial Neue", sans-serif;
}
- DesignFills, text, and components.
- MotoDurations, easings, and springs.
- TemporalColor grades and title styles.
- Varial UIComponent themes and charts.
The rest of the job. Same app, same file.
- CollaborationThe same file at the same time, and the comment becomes the task.
- ProofSend a version, collect notes on the art, get a decision in writing.
- InvoicingQuote the job and bill the work that got approved.
- Varial MCPReal project context for your AI tools. Read only.
- ProvenanceA receipt on every deliverable, without your prompts.
Good questions. Short answers.
Is a brand kit the same as a style guide?
A kit is the working version. It is what your files actually read from, not a PDF describing them.
Can I have more than one?
Yes. Keep a kit per client or product and switch between them in a file.
What happens if I change a token?
Everything bound to it updates. Varial shows you what will change before you commit.
Do kits work offline?
Yes. A kit is part of your workspace and is there whether you are online or not.
Can I hand a kit to a developer?
Export it as CSS variables, or point their AI tools at the MCP server and let them read it.