Feature Request — Figma Design Generation from Running UI (Code → Design)

Hi Anthropic team,

I'm using Claude Code professionally for a full web development project (Next.js + Payload CMS + Tailwind CSS). The current Figma MCP integration provides read capabilities — fetching design data and downloading images from Figma — which works well.

However, the critical missing piece is the reverse direction: Code → Design.

The problem

When Claude Code builds a complete website iteratively (layout, components, styling, animations), the result exists only as running code. There is no way to push the current UI state into Figma as editable layers. This means:

• The client cannot review, annotate, or iterate on the design in Figma
• The designer cannot refine spacing, typography, or colors visually before the next code iteration
• The design↔code feedback loop is broken — code generates design, but design tools can't see it

What I need

A tool (e.g. generate_figma_design) that captures a running UI from a browser URL and converts it into editable Figma frames — not flattened screenshots, but actual layers with text nodes, rectangles, images, and styles that a designer can modify.

Why this matters

For agencies and studios building client-facing websites, the workflow is: prototype → client review in Figma → refine → implement. Without Code → Design capability, Claude Code can only participate in half of this workflow. This is the single biggest gap preventing Claude Code from being a complete web development tool.

Current workaround

None that is practical. Manual screenshot import loses all editability. Third-party plugins (html.to.design) exist but are disconnected from the Claude Code workflow.

Thank you for considering this. Happy to provide more context or test early implementations.

Contact: info@elasticle.cz