Convert screenshots or design mockups into functional frontend code. Supports HTML/Tailwind, React, Vue, and more.
Screenshot to Code is easy to set up with trust notes worth reviewing. Check agent compatibility and use-case fit before adding it to your workflow.
gh repo view abi/screenshot-to-code --webOpen the official repository or website.
Check the README for package manager, auth, and platform requirements.
Try it in a small test task inside your agent workflow.
Repository setup guidance
Strong trust signals; still review the README and permissions before production use.
Last commit was about 119 days ago.
60000 GitHub stars indicate community interest.
310 open issues signal maintenance load.
MIT license detected.
2 security/trust notes recorded.
Setup difficulty is 2/5.
Generate design system documentation for UI components directly from your AI agent, rendering into Figma or portable .md files.
Argos is an open source visual testing platform that detects unintended UI changes to help teams maintain quality.
Bidirectional MCP bridge that lets AI draw UI directly on Figma canvas and read designs back as structured data.
Extract any website's complete design system with one command.
Screenshot to Code takes a screenshot of any UI and generates the corresponding frontend code. Upload a design, select your stack (HTML+Tailwind, React, Vue, Bootstrap), and get clean, runnable code in seconds. Great for turning Figma designs into production React components.
60,000
Stars
7,700
Forks
310
Issues
MIT
License
Convert screenshots or design mockups into functional frontend code. Supports HTML/Tailwind, React, Vue, and more.
Frontend Developers, Designers
The setup section provides repository-level starting guidance, not a guarantee of an independently verified installation. Check the official README and release notes.
API key required for AI vision model Uploaded screenshots are processed by AI service
Similar or complementary options to evaluate include uSpec, Argos, figma-ui-mcp.
Aug 20, 2026