Figma annotation skill.
Prepares a Figma design for Webflow and Smootify: which components to build, their props and bindings, the Smootify markup inside them, and where each instance is connected.
Load it on the Figma file before building. It writes its decisions into the file as annotations, for the Figma to Webflow skill to build. Beta: version 2.0.0-beta.27.
- Decides which Webflow components the design needs, each built once
- Defines their variants and props, and what each prop is bound to
- Chooses the Smootify elements and attributes inside them, from the 2.0 glossary
- Asks you whenever the design does not settle a choice, instead of guessing
- Writes everything into the Figma file as Dev Mode annotations, and reports the open questions
- Touch Webflow
- Guess what the design does not say
- Change the design itself
Install it in your agent.
Claude Code
Add Smootify's marketplace and install the plugin: it holds all five skills, and updates with each version.
claude plugin marketplace add smootify/skills
claude plugin install smootify@smootifyClaude on the web and desktop
Download the zip and upload it in Settings → Customize → Skills. To update, upload the new zip in its place.
Download the zipCursor, Codex and other agents
The skill is a folder with a SKILL.md: copy it from the zip or from GitHub to where your agent reads skills.
Start in Figma.
Go live on Shopify.
Free to build, pay only when you go live. One Shopify app instead of ten, billed on the store’s Shopify invoice.
- One app on the Shopify bill, not ten
- Free to build, pay only when you go live
- Works on Basic, Grow and Advanced
- Your 1.x store keeps working
- Every element stays yours to change
- Docs indexed in llms.txt