How to Design and Code with Claude Code and Figma MCP in 50 Min | Felix Lee

How to Design and Code with Claude Code and Figma MCP in 50 Min | Felix Lee

More

Descriptions:

In this interview-style session hosted by Peter Yang, Felix Lee — CEO of ADP List and a designer who began vibe coding around the 2025 holidays — walks through a series of products he built using Claude Code and the Figma MCP integration, demonstrating what the designer-to-developer pipeline looks like in practice after roughly three and a half months of hands-on experience.

The projects showcased include his personal website (felix.dev) with a Supabase-backed RAG chatbot that answers questions about his background and ADP List, a real-time global booking visualization for ADP List built with live 2025 session data, and a landing page built live during the session using Figma MCP. A key technical comparison emerges: when designers pass screenshots to Claude Code, the model requests individual assets one by one in a back-and-forth loop; when the Figma MCP is connected, it automatically ingests all vectors, icons, and components as editable SVGs, dramatically reducing iteration time. Lee estimates the live landing page build took under 15 minutes end-to-end.

The conversation also covers Claude Code’s output quality versus other coding agents (Lee singles it out as the strongest he’s tested from a design fidelity standpoint), how to use Opus 4.5 to convert light-mode images to dark-mode equivalents without manual assets, and an advanced use case building a playable game directly from a FigJam canvas. Essential viewing for designers exploring Claude Code as a primary build tool.


📺 Source: Peter Yang · Published March 22, 2026
🏷️ Format: Hands On Build

1 Item

Channels