OneClick

About this plugin

What This Plugin Does (Plain English)You select a Figma frame → click Compile → receive:a production-ready React componentclean JSXCSS Modules or Tailwindprops inferred automaticallyassets exported and wireda tiny README so it’s not a mysteryNot a demo. Not a code dump. Something you can paste into a repo and ship.Core User Flow (Simple, Fast)Select a FrameMust be auto-layout aware (warn if not)Choose OutputReact + CSS ModulesReact + TailwindClick CompilePlugin analyzes structureShows a preview of props + filesOne-click export (zip or copy)That’s it.What It Compiles (MVP Scope)1. Layout → JSXAuto Layout → flexDirection, gap, alignment mapped cleanlyNested frames → nested components (optional toggle)Example output:integration-error.md: 9 lines selected2. Text → PropsText layers become props by defaultOption to “lock” text as staticSmart prop naming:Title / Heading → titleButton Label → ctaText3. Images & IconsExported as optimized PNG/SVGWired as importsOptional inline SVG for icons4. Styles (Two Modes)CSS ModulesClean class namesNo inline stylesShared tokens groupedTailwindUtility classes generated intelligentlyNo insane class spamRespects spacing & typography scales