Direct answer
Give Cursor durable design rules, existing components, one user task, and a browser review of every changed state.
Separate durable rules from task context
Project rules should hold conventions that apply repeatedly, such as component locations, token usage, accessibility requirements, and verification commands. The task prompt should describe the current user, screen, and outcome.
Keeping those layers separate reduces repeated prompting without turning every feature request into a large instruction file.
Connect design tools through MCP
Cursor supports MCP tools and remote HTTP servers. Connect Better Design so the agent can retrieve a design system, UI and UX principles, icon guidance, and review rules while it works.
- Use a project connection when the design context belongs to one codebase.
- Use a global connection when the same tools should be available across projects.
- Keep tool permissions narrow and review what each server can access.
Prompt with constraints that survive code
This prompt names the user, task, existing system, action hierarchy, guidance, and verification. It leaves room for implementation choices without leaving the design unconstrained.
Build the account onboarding form for first-time workspace owners. Use the existing form primitives and semantic tokens. Keep workspace creation as the primary action. Load guidance for forms and hierarchy before coding, then test errors, keyboard flow, and the 390px layout.Inspect more than the default state
- Open menus, dialogs, and selectors.
- Tab through every control and confirm a visible focus state.
- Trigger validation and empty states.
- Check mobile width and long content.
- Review console errors and layout warnings.
Questions
Do Cursor rules replace a design system?
No. Rules can tell the agent where components live and how to work, while the design system provides the actual tokens, components, and visual decisions.
Should every UI prompt include a reference image?
No. Reference images help when visual direction is uncertain, but established product screens and tokens are often better evidence for work inside an existing application.
Can Better Design replace Cursor's built-in coding tools?
No. Better Design supplies design context and review guidance. Cursor still reads the codebase, edits files, runs commands, and implements the feature.