01
Tokens with names
Your color palette, type scale, spacing, corners and elevation as exact values instead of visual approximations.
A DESIGN.md is a plain-language design spec for the AI coding agents in your repository. Onefold reads your website and turns the choices spread across your product into one editable file before the next screen gets built.
Create your DESIGN.mdAn agent can read the code in front of it, but it cannot infer why your buttons are square, which gray belongs on a quiet surface, or how an error should sound. Without that context, it chooses a plausible default.
DESIGN.md makes those decisions available at the moment an agent needs them. It is not a component library or a replacement for design work. It is the brief that lets an agent build within the system you mean to have.
01
Your color palette, type scale, spacing, corners and elevation as exact values instead of visual approximations.
02
The choices that matter when an agent has to make a new screen: what to keep consistent, which component library and icon set to reuse, and what to avoid.
03
A DESIGN.md plus matching CSS variables and Tailwind theme values for light and dark, so guidance and implementation stay aligned.
Start from your website or one color, then answer a guided set of questions. Keep every suggestion, change it, or leave a decision open for an agent to ask about later.
Keep it where coding agents can read it with the rest of the project instructions. Add a short reference from AGENTS.md if you use one.
Claude Code, Cursor, Codex and similar agents begin with your constraints, not their preferred gradients, type and button shapes.