正在加载视频...

视频加载失败

加载此视频时出现问题。这可能是由于临时网络问题，或视频可能不可用。

Testing the code generated from your figma designs 👀 You can resize the preview and test for mobile, tablet and desktop. I added zoom, bg color, padding, alignment and export to PNG for sharing. Just in case Claude doesn't center it correctly or give the right background. Fingers crossed... show more

Meng To

176,051 subscribers

17,708 次观看 • 1 年前 •via X (Twitter)

教育艺术科学技术

Anya Rossi• Live Now

Private livecam show

10 条评论

Seán 的头像

Seán1 年前

Figma are worried fr

Dami Dina 的头像

Dami Dina1 年前

Very cool

Daniel Isaac 的头像

Daniel Isaac1 年前

When do you think it’ll be approved? I feel like it’s been a while already.

Bilal Harouchi 的头像

Bilal Harouchi1 年前

I'm trying to send you a DM.

Meng To 的头像

Meng To1 年前

Feel free to use my email Meng at

Kurosh 的头像

Kurosh1 年前

Saving this, is there a dope workflow from going to this to narivebase expo in cursor?

Meng To 的头像

Meng To1 年前

Is that react native?

Dan Humphreys 的头像

Dan Humphreys1 年前

Bruhhhh come on figma

RadioTom.edu 🍊 的头像

RadioTom.edu 🍊1 年前

Figma better hurry up

Tim Gabe 👨‍🎨 的头像

Tim Gabe 👨‍🎨1 年前

really interested in testing this for some clients once it’s out! doing great work for the people as always, meng 👏⭐️🙌

相关视频

Figma just became obsolete. one-shots entire UI designs using your Claude Code subscription. - MCP connects to Cursor, Claude Code, or Codex - Fully editable designs - Export to Figma or PNG The kicker? It's completely free right now.

Figma just became obsolete. one-shots entire UI designs using your Claude Code subscription. - MCP connects to Cursor, Claude Code, or Codex - Fully editable designs - Export to Figma or PNG The kicker? It's completely free right now.

Sanket 🛠️ClawKraft

37,940 次观看 • 9 个月前

You can make your Figma designs functional with Claude AI Select component, go to Dev Mode and use Figma to Code plugin to turn to React/Tailwind. Copy the code and paste to Claude AI. Prompt "Create this component and center it". Then, "Make this functional", "Add rounded corners", "add hover states", "animate transitions". Don't forget to ask "always give full code". Otherwise, it might break the Artifact.

You can make your Figma designs functional with Claude AI Select component, go to Dev Mode and use Figma to Code plugin to turn to React/Tailwind. Copy the code and paste to Claude AI. Prompt "Create this component and center it". Then, "Make this functional", "Add rounded corners", "add hover states", "animate transitions". Don't forget to ask "always give full code". Otherwise, it might break the Artifact.

Meng To

172,088 次观看 • 2 年前

We did it! made a Figma plugin for Trace Convert your designs into SwiftUI and preview your screens right inside your figma canvas in minutes.

We did it! made a Figma plugin for Trace Convert your designs into SwiftUI and preview your screens right inside your figma canvas in minutes.

vidy

82,336 次观看 • 2 年前

My Figma to AI Code plugin is live Turn your designs into production-level code generated by Claude AI. Create React components, SwiftUI prototypes, HTML+CSS pages, Tailwind styles with custom prompts. Preview for responsiveness and export fully working code to Cursor and Xcode. It's free with your own API keys

My Figma to AI Code plugin is live Turn your designs into production-level code generated by Claude AI. Create React components, SwiftUI prototypes, HTML+CSS pages, Tailwind styles with custom prompts. Preview for responsiveness and export fully working code to Cursor and Xcode. It's free with your own API keys

Meng To

76,193 次观看 • 1 年前

Did it! Published the Figma plugin I’ve wanted for 5 years. 🎨 Create / adjust your custom color scale ⚡️ Figma variables update in real-time So now you can test your custom color scale instantly on real designs! 👉 Watch it in action, skip to 0:20

Did it! Published the Figma plugin I’ve wanted for 5 years. 🎨 Create / adjust your custom color scale ⚡️ Figma variables update in real-time So now you can test your custom color scale instantly on real designs! 👉 Watch it in action, skip to 0:20

Erik

21,727 次观看 • 1 年前

We built the fastest way to vibe design mobile apps. From idea to screen designs in under 2 minutes. Export to code or Figma. Comment "sleek" for early access.

We built the fastest way to vibe design mobile apps. From idea to screen designs in under 2 minutes. Export to code or Figma. Comment "sleek" for early access.

Mattia

890,477 次观看 • 11 个月前

I made a plugin that turns figma designs to code using Claude AI Works with HTML, CSS, Tailwind, SwiftUI, Flutter, etc. This is production level code and you can enter custom prompts like "make it functional" or "add hover states". Oh and it's free. You can use your api keys.

I made a plugin that turns figma designs to code using Claude AI Works with HTML, CSS, Tailwind, SwiftUI, Flutter, etc. This is production level code and you can enter custom prompts like "make it functional" or "add hover states". Oh and it's free. You can use your api keys.

Meng To

221,140 次观看 • 1 年前

Need help deciding which color palette to use for your designs? Designer Milan Maheshwari's Spectrum plugin can help with that. You can instantly generate color palettes and apply them to illustrations, images, interfaces, and more.

Need help deciding which color palette to use for your designs? Designer Milan Maheshwari's Spectrum plugin can help with that. You can instantly generate color palettes and apply them to illustrations, images, interfaces, and more.

Figma

94,041 次观看 • 3 年前

UI/UX Designers, did you know you can convert your PNG images to SVG format and customize the colors directly in Figma? Quick Tracing is a Figma plugin that allows you to easily trace and convert images into vector shapes directly within Figma with just one click.

UI/UX Designers, did you know you can convert your PNG images to SVG format and customize the colors directly in Figma? Quick Tracing is a Figma plugin that allows you to easily trace and convert images into vector shapes directly within Figma with just one click.

Abraham John 🦄🦓

72,101 次观看 • 2 年前

Introducing Figma Connect 2.0 Copy multiple designs in Figma, paste them into MagicPath, and get clean react code instantly. Auto Layout and responsiveness, all preserved. Your Figma designs become code any agent can understand and build with. Codex, Claude Code, and more.

Introducing Figma Connect 2.0 Copy multiple designs in Figma, paste them into MagicPath, and get clean react code instantly. Auto Layout and responsiveness, all preserved. Your Figma designs become code any agent can understand and build with. Codex, Claude Code, and more.

Pietro Schirano

39,711 次观看 • 2 个月前

Holy sh*t I spent weeks turning Claude Code into a design studio. no Figma license. no agency. no plugins I had to pay for. here's the stack I used and it's embarrassingly simple: -> graphify: teach Claude your brand dump your guidelines, logos, PDFs and old projects into one folder. graphify turns it into a knowledge graph, so every design Claude makes follows your rules instead of guessing. 134k stars, Y Combinator. uv tool install graphifyy -> graphify install -> /graphify . -> Figma-Context-MCP: Figma straight to code it hands your actual Figma file to the agent. the README says it builds designs in one shot, and does it better than pasting screenshots. -> Penpot: the open-source Figma free, open source, and its MCP server lets AI read and edit your designs, then hand them to code and back. -> React Bits: the "expensive" look, for free the biggest open-source library of animated React components. those smooth hover effects and text animations you see on high-end sites? copy, paste, done. -> HyperFrames: designs that move write HTML, get a finished video. made by HeyGen for AI agents. your landing page can now have its own launch video by tonight. claude plugin marketplace add heygen-com/hyperframes -> claude plugin install hyperframes@hyperframes -> MCP for Blender: 3D without learning Blender connects Claude to Blender. describe a scene, the agent builds and edits it in real 3D. the order that works: brand into graphify -> design in Figma or Penpot -> Claude builds it with React Bits -> HyperFrames makes the promo -> Blender adds the 3D hero shot the uncomfortable part: tools used to be the moat. now everyone has them for free. the only thing that still separates good design from AI slop is taste. and taste is the one thing you can't install. bookmark this. your next client will ask why you're suddenly so fast.

kiosa

67,811 次观看 • 5 天前

We just built Figma for Claude Code > Select any element on your local front-end > Edit it like you would in Figma > Apply the changes with Claude Code This is not a demo or waitlist. Try it today.

We just built Figma for Claude Code > Select any element on your local front-end > Edit it like you would in Figma > Apply the changes with Claude Code This is not a demo or waitlist. Try it today.

Quentin Romero Lauro

252,617 次观看 • 8 个月前

Introducing our Free Figma-to-Code converter. Copy your design directly from Figma and paste it into our canvas. Our compiler converts your figma design into code, and you can export it in your preferred format. Free to use, with no limits. No login required, try it here👇

Introducing our Free Figma-to-Code converter. Copy your design directly from Figma and paste it into our canvas. Our compiler converts your figma design into code, and you can export it in your preferred format. Free to use, with no limits. No login required, try it here👇

Praha

26,570 次观看 • 1 个月前

Tired: code or canvas Wired: code AND canvas Introducing Claude Code to Figma

Tired: code or canvas Wired: code AND canvas Introducing Claude Code to Figma

Figma

3,078,499 次观看 • 8 个月前

Getting close to Figma component spec plugin MVP feature complete, and ready for deeper testing and getting feedback from the community.

Getting close to Figma component spec plugin MVP feature complete, and ready for deeper testing and getting feedback from the community.

Nathan A Curtis

203,066 次观看 • 3 年前

Introducing the RevenueCat Figma plugin. Design in Figma → import to RevenueCat → ship instantly. Fully native, ready to A/B test and deploy remotely. No rebuilding designs. No app updates.

Introducing the RevenueCat Figma plugin. Design in Figma → import to RevenueCat → ship instantly. Fully native, ready to A/B test and deploy remotely. No rebuilding designs. No app updates.

RevenueCat

7,587,137 次观看 • 11 个月前

btw, from Figma → Code via Pencil > just copy/paste: cmd+C in Figma, cmd+V in Pencil > styles and layout settings preserved, pixel perfect > claude code produces the code that fits your repo code, requirements and rules, you are in charge

btw, from Figma → Code via Pencil > just copy/paste: cmd+C in Figma, cmd+V in Pencil > styles and layout settings preserved, pixel perfect > claude code produces the code that fits your repo code, requirements and rules, you are in charge

Tom Krcha

15,441 次观看 • 9 个月前

I designed this mobile app in Figma and decided to build it with Claude Code. These are some of the interactions I’ve built so far. Compared to the last time I tried building a mobile app with Claude Code for a client, this has been sooo much easier.

I designed this mobile app in Figma and decided to build it with Claude Code. These are some of the interactions I’ve built so far. Compared to the last time I tried building a mobile app with Claude Code for a client, this has been sooo much easier.

Wuraola | Product Designer

18,246 次观看 • 1 个月前

I'm getting close to releasing Figma to shadcn plugin. The plugin will allow you to generate accurate, high-quality, and responsive shadcn/ui code based on your Figma designs 💪 Guillermo Rauch When will the v0 API be available? I would love to add "Open in v0" feature! 🙏

I'm getting close to releasing Figma to shadcn plugin. The plugin will allow you to generate accurate, high-quality, and responsive shadcn/ui code based on your Figma designs 💪 Guillermo Rauch When will the v0 API be available? I would love to add "Open in v0" feature! 🙏

Matt

123,035 次观看 • 1 年前

Claude Code on desktop can now preview your running apps, review your code, and handle CI failures and PRs in the background. Here’s what's new:

Claude Code on desktop can now preview your running apps, review your code, and handle CI failures and PRs in the background. Here’s what's new:

Claude

9,332,938 次观看 • 8 个月前