Connect Claude and Claude Code to the Figma canvas as you build prototypes and production apps. Send your product screens to Figma, where they become editable layers using your design system components. Share these designs and collaborate with your team, or send them back to Claude Code to implement the designs in your codebase. The Figma connector works bidirectionally to: ‍ Turn production code into editable designs: "Capture my homepage and bring it into this Figma file as layers using my design system components with /figma-use" Generate code from designs: "Implement the selected Figma component as React code following my codebase standards and annotations" Build and maintain your design system: "Generate Figma components and variables from my codebase, then audit the file for design system drift" Create diagrams in FigJam: "Turn this system architecture description into a flowchart in FigJam" Build decks in Figma Slides: “Create a post-launch presentation in Figma Slides from this attached report”

claude plugin install figma@claude-plugins-official