Translate design exports (HTML + screenshot) into design-system-aligned code through ten explicit gates. A Claude Code plugin.
-
Updated
Jun 6, 2026 - JavaScript
Translate design exports (HTML + screenshot) into design-system-aligned code through ten explicit gates. A Claude Code plugin.
Turn raw frontend input into a stronger handoff package before code generation.
Local Figma Desktop plugin and localhost bridge for AI-ready design handoff bundles, without Figma API, Dev Mode MCP, or access tokens.
The last mile of vibe coding. Make any AI-generated page editable in the browser; export AI-ready diffs to Cursor / Claude / your dev.
A front-end project transforming a UX student's design into a React-based landing page for a gym/fitness club. This project bridges the gap between design and development, showcasing the art of bringing visuals to life with code. The designer is Alice Li.
Design review, directly on your site. Inspect, annotate, and export changes as JSON for developer handoff.
This project was about transforming a UX student's design into a React-based landing page for a gym/fitness club. The design for this Yogastudio page is by Meriem Manouchi.
Lift Logger UI handoff for Flutter — 50 audited screen states + interactive prototype
Avocode APIs.json profile
Zeplin APIs.json profile for API Evangelist catalog
Free and handy AI-built tools I use every day, shared so you don’t have to spend your own tokens reinventing them.
Design-system handoff and repo-aware implementation bridge for Figma.
Add a description, image, and links to the design-handoff topic page so that developers can more easily learn about it.
To associate your repository with the design-handoff topic, visit your repo's landing page and select "manage topics."