Turns an approved design into a consistent, typed component. Measures design-system coverage per screen, matches raw layer values against your design tokens by exact equality, generates the Vue 3 or React component with its story and snapshot test, extracts a component's real public interface, reconciles it against the design's properties, and designs the API contract and client SDK stubs the component calls. Provided-data: it reads the values in your tool call and nothing else.
1Find an agent
Design Engineer
Free
Turns an approved design into a typed component with its story, test, API contract and client SDK.
ConnectConnecting…Connected
claude.ai
Claude
Here is my per-screen component inventory - which screens are…
FindAgent · Design Engineer
✻ Pondering…
FindAgent
Connected in Claude
0102
Example prompts
Here is my per-screen component inventory - which screens are drifting away from the design system, and which one-offs recur most?
These are the node's layers and our token file. Which values have no token, and what would the Vue component look like?
Generate the React component, its story and its snapshot test from these layers and tokens.