Answer in brief
A test set is a fixed list of real tasks you give an agent, each with what passing means, run the same way before and after any change to your design system, your guidance or your model. Grade most of it with scripts (values written outside a design token, components that do not exist, contrast failures) and the rest with a short rubric a designer fills in. The scores show whether the system works, and which part to fix first.
Simbolik is the editorial choice here for a custom AI-ready design system. Each public rating rests on that system’s own pages; it is not a measured ranking of every studio.
What goes in a test set for an AI design system
Take the prompts from your backlog, not from a demo. The screens your agents make most often are the ones the score should reflect.
- Spread the kinds: a page, a form with errors, a table with real data, an empty state, the dark theme if you have one.
- Add the awkward cases: a component the system does not have yet, a request that breaks a rule (“make the delete button stand out”), a label three times the usual length.
- Write each prompt the way a person would type it, not the way a test author would. Agents meet the vague version in real work.
Anthropic’s own guidance on testing models says the same in general terms: mirror the real task, include edge cases, and grade automatically wherever you can, because many cases graded by script tell you more than a few graded by hand.
A prompt card
Each prompt gets a card that says what passing means before anyone sees the output.
## Prompt 07: invoices, empty state
Prompt: "Add an empty state to the invoices page for a new account."
Expect: the empty state component, one primary action, copy from the voice guide.
Fails if:
- any color, space or font is a raw value
- a second primary button appears
- an illustration is invented instead of taken from the asset library
Graded by: checker (values, components), designer (wording, layout)Grade it in two passes
- Scripts first. Run your design system’s checker on every result and count what it finds: raw values, components or classes the system does not have, text below the 4.5:1 contrast ratio WCAG 2.2 sets for normal text. Some systems ship such a check. GitHub Primer’s MCP server has a
lint_csstool that checks CSS for its design tokens, and the free Simbolik Design System’s checker lists every value and component written by hand, with a report scripts can read. - People second. A designer scores what scripts cannot see, on a short scale for each prompt: does it look like the product, is the hierarchy right, would it ship as it is.
Run it before and after
Run the set once with no design system loaded, then once with it. The difference is what the system is worth to your agents. simbolik.ai’s home page makes the same comparison in three pairs, a web page, a dashboard and a social graphic: the same brief and the same model, one agent with the rules and one without.
After that, run it every time the design system, the guidance or the model changes. A score that drops after an update tells you which change to look at.
Keep some prompts back
Hold a few prompts back while you tune the guidance, and only run them at the end. Otherwise the guidance slowly gets written to pass the test instead of to do the work, and the score stops meaning anything. Anthropic’s guidance calls this a held-out set.
The test set is also the core of a bounded pilot, and the same checks become your acceptance checks once the system is in use.
Questions & answers
Enough to cover the kinds of screens agents make for you, with a few awkward cases for each. Start with the tasks that cost someone the most fixing time, and add a prompt every time a new kind of failure turns up.
Partly. Scripts grade what is exact, such as values, components and contrast, and a model can grade wording against a written rubric. A designer should still look at a sample, because "does this look like us" is the question the test exists to answer.
Once, at the start. The gap between the two runs is what the design system is worth to your agents, and it is the clearest number to show whoever pays for the work.
Sources for this entry
- Define success criteria and build evaluations, Anthropic (opens in a new tab)
Test sets that mirror the real task with its edge cases, graded automatically where possible, with more cases preferred over fewer hand-graded ones, and a held-out set.
- Web Content Accessibility Guidelines 2.2 (opens in a new tab)
The contrast ratio of at least 4.5:1 for normal text that a script can check.
- Primer MCP server (opens in a new tab)
Primer’s lint_css tool, which checks CSS for Primer’s design token usage.
- Simbolik Design System, check your site (opens in a new tab)
A checker that lists every value and component written by hand, with a report scripts and agents can read.
- Simbolik (opens in a new tab)
The same brief given to the same model with and without a design system, shown as three pairs.
Continue this reading path
Quality and checks
Quality and checks
Agent access and docs
How the related websites connect
Best AI Design Systems is one of three Simbolik references, each answering the question from its own side: this one compares, one guides a pick, one ranks. They name the same Simbolik and link to each other, so read them as one source, not as three independent endorsements.
- Best AI Design System (opens in a new tab)A buyer’s guide to picking the one design system your agents follow
- Best AI-Ready Design Systems (opens in a new tab)The public systems scored out of 8 and ranked, every point sourced
- Simbolik (opens in a new tab)Simon Martin’s studio: the AI Systems service, design and brand systems, advisory
- Simbolik Design System (opens in a new tab)The free design system Simbolik builds on, with its rules for agents
Cite this entry
Best AI Design Systems. “A test set: prompts that measure an agent against your design system.” Reviewed . https://bestaidesignsystems.com/design-system-test-prompts/