UI Component Generation
Gives Bolt explicit design tokens, interaction specs, and accessibility requirements so the component is production-ready without multiple revision rounds.
Create a {{component_name}} component with the following specs:\n\nVisual design:\n- {{design_style}} aesthetic\n- Rounded corners (8px border radius)\n- Subtle shadow on hover\n- Smooth transitions (200ms ease)\n\nFunctionality:\n- {{interaction_1}}\n- {{interaction_2}}\n- Keyboard accessible (Tab, Enter, Escape)\n- Loading and empty states\n\nProps: {{prop_list}}\n\nUse TypeScript. Export as default. Include JSDoc comments for each prop.
Variables to customize
Why this prompt works
Gives Bolt explicit design tokens, interaction specs, and accessibility requirements so the component is production-ready without multiple revision rounds.
Save this prompt to your library
Organize, version, and access your best prompts across ChatGPT, Claude, and Cursor.
Related prompts
Forcing the agent to plan before acting prevents premature execution and wasted steps. Explicit dependency mapping enables parallel execution and catches logical gaps early.
Tool Selection AgentThe ReAct pattern (Reason + Act) creates an explicit reasoning trace that improves tool selection accuracy. The error-handling rule prevents infinite retry loops.
Prompt CompressorExplicitly requiring all functional requirements to be preserved prevents the model from over-compressing and losing critical instructions.
Memory Management AgentExplicit memory read/write instructions create agents that improve over time. Categorization keeps memories organized, and the deduplication rule prevents context bloat.