Video yükleniyor...

Video Yüklenemedi

Ana Sayfaya Dön

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...

MengTo's profile picture

Meng To

176,051 subscribers

17,708 görüntüleme • 1 yıl önce •via X (Twitter)

EğitimSanatBilim & Teknoloji
LIVE

Anya Rossi• Live Now

Private livecam show

10 Yorum

Seán profil fotoğrafı
Seán1 yıl önce

Figma are worried fr

Dami Dina profil fotoğrafı
Dami Dina1 yıl önce

Very cool

Daniel Isaac profil fotoğrafı
Daniel Isaac1 yıl önce

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

Bilal Harouchi profil fotoğrafı
Bilal Harouchi1 yıl önce

I'm trying to send you a DM.

Meng To profil fotoğrafı
Meng To1 yıl önce

Feel free to use my email Meng at

Kurosh profil fotoğrafı
Kurosh1 yıl önce

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

Meng To profil fotoğrafı
Meng To1 yıl önce

Is that react native?

Dan Humphreys profil fotoğrafı
Dan Humphreys1 yıl önce

Bruhhhh come on figma

RadioTom.edu 🍊 profil fotoğrafı
RadioTom.edu 🍊1 yıl önce

Figma better hurry up

Tim Gabe 👨‍🎨 profil fotoğrafı
Tim Gabe 👨‍🎨1 yıl önce

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

Benzer Videolar

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.
0:27

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 görüntüleme • 9 ay önce

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.
6:06

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 görüntüleme • 2 yıl önce

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.
0:52

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 görüntüleme • 2 yıl önce

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
0:29

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 görüntüleme • 1 yıl önce

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
0:35

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 görüntüleme • 1 yıl önce

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.
0:22

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 görüntüleme • 11 ay önce

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.
0:37

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 görüntüleme • 1 yıl önce

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.
0:31

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 görüntüleme • 3 yıl önce

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.
0:30

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 görüntüleme • 2 yıl önce

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.
0:50

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 görüntüleme • 2 ay önce

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.
0:20

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 görüntüleme • 5 gün önce

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.
0:22

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 görüntüleme • 8 ay önce

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👇
1:28

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 görüntüleme • 1 ay önce

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

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

Figma

3,078,499 görüntüleme • 8 ay önce

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

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 görüntüleme • 3 yıl önce

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.
0:44

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 görüntüleme • 11 ay önce

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
0:34

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 görüntüleme • 9 ay önce

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.
3:16

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 görüntüleme • 1 ay önce

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! 🙏
0:33

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 görüntüleme • 1 yıl önce

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:
1:15

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 görüntüleme • 8 ay önce