figma-to-weaverse

Installation
SKILL.md

Figma to Weaverse

Turn a Figma design into maintainable Weaverse pages. This is the Figma input adapter — the sibling of cloning-websites-to-weaverse, but the source is a Figma file instead of a live URL. Both adapters converge on the same downstream skill, generating-weaverse-project-json.

Figma file / frame ─→ figma-to-weaverse ─→ generating-weaverse-project-json ─→ import / content API
   (Figma MCP)        (tokens + manifest + preview)        (project JSON)

The two adapters share the same downstream rules. Section matching, deep schema verification, the content manifest, the clone preview route, and the brand-guideline conflict rule are identical to cloning-websites-to-weaverse — read that skill for the full matching logic. This skill only replaces the extraction layer (Figma MCP instead of Firecrawl) and adds Figma-specific gotchas.

When to Use

  • A figma.com URL (file, frame, or selection) is the source of a page or storefront
  • "Implement this design in Weaverse", "build the homepage from Figma"
  • Multi-frame flows that map to multiple Weaverse pages

Do not use it for live-website cloning (use cloning-websites-to-weaverse) or tiny copy edits.

Installs
32
GitHub Stars
86
First Seen
Jun 24, 2026
figma-to-weaverse — weaverse/shopify-hydrogen-skills