Recreate UI from screenshots using multi-model extraction and visual verification.
npx skills add https://github.com/primovera12/Master-Kit --skill recreate
Please help me install this Agent Skill. Skill: recreate Source: https://github.com/primovera12/Master-Kit/tree/main/Master-Starter-Kit/tools/skills/recreate Command: npx skills add https://github.com/primovera12/Master-Kit --skill recreate
Recreate UI from screenshots or Dribbble images automatically by detecting multiple screens, performing triple extraction (Gemini + Super Design + Claude Vision), cross-validating results, generating production-ready code, and verifying visually with Playwright.
Provide an image or Dribbble URL and run the design-lab workflow to produce a pixel-accurate recreation.
High-intent search queries and answers about installing and using this skill.
To convert a screenshot into UI code, provide an image or Dribbble URL to trigger a multi-model extraction pipeline that generates production-ready frontend code. This process uses triple extraction with Gemini, Super Design, and Claude Vision to ensure pixel-accurate recreations.
Recreating a UI design from a Dribbble image is best handled by a cross-validation pipeline that detects multiple screens, performs triple model extraction, and generates code. It visually verifies the output with Playwright to ensure the final recreation matches the original design.
Yes, you can separate multiple screens from a single design showcase screenshot. The extraction pipeline automatically detects and isolates individual screens within artistic showcases, such as device mockups containing two to four separate UI screens, before generating code.
Visual verification with Playwright ensures pixel-accurate UI code generation by cross-validating the extracted design elements and visually confirming the rendered output. This step guarantees the generated frontend code matches the original screenshot before integration.
No, you do not need to provide a design brief to generate frontend code from a screenshot. You can simply drop a UI image or provide a Dribbble URL, and the workflow automatically extracts the design to produce a pixel-accurate recreation suitable for integration.
tyronerossCapture and store web design screenshots with configurable viewports.
AirMileConvert screenshots or URLs into frontend code with Playwright verification.
moongci38-ossCapture web page screenshots and analyze them with Gemini Vision for visual consistency.
gaoqiongxieConvert UI design screenshots into interactive HTML prototypes.
