Back to Plugins
Stitch - Code <> Figma

Stitch - Code <> Figma

Convert screenshots, webpages, HTML, and Figma selections into editable structure.

Plugin Preview

Stitch - Code <> Figma preview

About this plugin

Stitch is a conversion workspace for product designers, frontend engineers, growth teams, and anyone who needs to move between Figma and code quickly.Use it in four modes:- HTML to Figma: paste HTML/CSS and generate editable Figma layers.- URL to Figma: import a public webpage into a Figma canvas.- Screenshot to Figma: upload a clean app screenshot, choose the target size, and generate editable Figma layers.- Figma to Code: select layers, frames, components, or instances and export single-file HTML+CSS.Stitch focuses on real structure instead of flattening everything into one bitmap. Text becomes editable text, shapes become Figma nodes, image fills are preserved when possible, SVGs stay visible, and gradients, borders, shadows, opacity, and rounded corners are mapped into editable properties.Screenshot to Figma shows staged progress for long-running generation, supports canceling, makes quota usage clear, and cleans temporary generated HTML after completion, failure, or cancellation.Best for rebuilding landing pages or app screens in Figma, reconstructing clean mobile app screenshots, importing webpage references, exporting Figma selections to inspectable HTML+CSS, and QA testing visual roundtrips between code and design.

Plugin Details

Version16
CreatedDecember 11, 2025
Last UpdatedJune 21, 2026
CategoryImport & export plugins
CreatorXiao Wen
Stats1489 installs, 100 likes
PricingFree

Technical Details

  • API:1.0.0
  • UI:ui.html
  • main:code.js
  • Document Access:dynamic-page
  • Network Access:

    Users can enter a web page URL or upload a screenshot so the plugin can fetch or generate HTML and convert it into editable Figma layers.

  • Editor Types:
    figma
  • Allowed Domains:
    • *