Loading video...

Video Failed to Load

Go Home

A super simple workflow to get DESIGN.md or HTML templates into Claude design. Grab from 400+ design systems and Claude will create the rest.

MengTo's profile picture

Meng To

179,608 subscribers

89,168 views • 5 months ago •via X (Twitter)

EducationScience & Technology
LIVE

Anya Rossi• Live Now

Private livecam show

0 Comments

No comments available

Comments from the original post will appear here

Related Videos

I made a super visual page for all the DESIGN.md we generate. 564 of them and more coming out every day. You can grab the design systems, web design skill prompts and HTML pages.
0:38

I made a super visual page for all the DESIGN.md we generate. 564 of them and more coming out every day. You can grab the design systems, web design skill prompts and HTML pages.

Meng To

76,212 views • 5 months ago

ANTHROPIC 🔥: Claude Code got a new /design command in research preview! Design in Claude Code adds an artboard workflow from Claude Design to help users build editable UIs. CCD 👀
0:40

ANTHROPIC 🔥: Claude Code got a new /design command in research preview! Design in Claude Code adds an artboard workflow from Claude Design to help users build editable UIs. CCD 👀

🚨 AI News | TestingCatalog

72,492 views • 1 month ago

From Claude Design to Figma in 60 seconds: (*updated flow!) 1. In Claude Design: Share → `Export as standalone HTML` 2. Download the file 3. Drop it into the Anima Agent 4. The agent renders it as editable Figma layers
0:33

From Claude Design to Figma in 60 seconds: (*updated flow!) 1. In Claude Design: Share → `Export as standalone HTML` 2. Download the file 3. Drop it into the Anima Agent 4. The agent renders it as editable Figma layers

Anima

741,768 views • 4 months ago

Combine ChatGPT Images 2.0 and Claude Design. Create a design brief with ChatGPT in the style that you'd like. Bring that image into Claude Design to make it functional. You can edit the fonts, colors, images and styles referencing the design you've built. Here's how:
0:51

Combine ChatGPT Images 2.0 and Claude Design. Create a design brief with ChatGPT in the style that you'd like. Bring that image into Claude Design to make it functional. You can edit the fonts, colors, images and styles referencing the design you've built. Here's how:

Jerrod Lew

39,289 views • 5 months ago

The DESIGN.md upgrade is officially live in Stitch! 🚀 Yesterday we open-sourced the spec, and today we are giving you more tools to use it: 📄 Start with DESIGN.md: Attach a DESIGN.md right at the start of a project. Don't have one? Our new wizard will help you extract one from your code base or the web. 🔄 DESIGN.md to Design System: Upload a DESIGN.md file to generate a Design System on the canvas. 🧩 Token Support: Design Systems now support design tokens from DESIGN.md! Add them to your file and Stitch will seamlessly incorporate them. 🗑️ Clean Up: (You asked, we listened) You can now easily delete a design system. We’re excited to build the open design standard together. 👇
0:33

The DESIGN.md upgrade is officially live in Stitch! 🚀 Yesterday we open-sourced the spec, and today we are giving you more tools to use it: 📄 Start with DESIGN.md: Attach a DESIGN.md right at the start of a project. Don't have one? Our new wizard will help you extract one from your code base or the web. 🔄 DESIGN.md to Design System: Upload a DESIGN.md file to generate a Design System on the canvas. 🧩 Token Support: Design Systems now support design tokens from DESIGN.md! Add them to your file and Stitch will seamlessly incorporate them. 🗑️ Clean Up: (You asked, we listened) You can now easily delete a design system. We’re excited to build the open design standard together. 👇

Stitch by Google

195,457 views • 5 months ago

Cursor's new browser + element annotation turns it into a design studio. Meet Cursor Design 🎨 — Claude Design, running locally. Describe a screen → get polished HTML → click any element in the preview & say what to change. Best w/ Opus 4.8. npx skills add JimLiu/baoyu-design
2:02

Cursor's new browser + element annotation turns it into a design studio. Meet Cursor Design 🎨 — Claude Design, running locally. Describe a screen → get polished HTML → click any element in the preview & say what to change. Best w/ Opus 4.8. npx skills add JimLiu/baoyu-design

宝玉

251,226 views • 3 months ago

How to Use Claude Design (Full AI Design Workflow) The best Claude Design guide for beginners you’ve seen People pay $500 for this course, and this guy published it for free. Save this before you forget
12:15

How to Use Claude Design (Full AI Design Workflow) The best Claude Design guide for beginners you’ve seen People pay $500 for this course, and this guy published it for free. Save this before you forget

AdiiX

79,075 views • 3 months ago

We made Agent Design real before Claude Design became part of Claude Code. Open Design brings a live, editable artboard to any agent. Find it in the Codex Plugin Directory, or use the prompt below for Claude and other AI agents. ↘️
0:21

We made Agent Design real before Claude Design became part of Claude Code. Open Design brings a live, editable artboard to any agent. Find it in the Codex Plugin Directory, or use the prompt below for Claude and other AI agents. ↘️

OpenDesign

42,759 views • 1 month ago

New in the Stitch Vibe Design launch: DESIGN.md Design consistency specified. Stitch generates design systems and a markdown specification you can export.
0:22

New in the Stitch Vibe Design launch: DESIGN.md Design consistency specified. Stitch generates design systems and a markdown specification you can export.

David East

91,117 views • 6 months ago

Claude design is cool but nobody is talking about how Gemini 3.1 Pro is a beast at motion design Only one prompt to turn an HTML into motion graphics
0:57

Claude design is cool but nobody is talking about how Gemini 3.1 Pro is a beast at motion design Only one prompt to turn an HTML into motion graphics

Meng To

65,066 views • 5 months ago

Cursor for Design? This Claude Code UI workflow is insane And many vibe coders not aware of it: 1. Claude Code can assign parallel tasks to sub agents 2. Integrate with git worktree to create sandbox env This means you can get Claude Code generate 10 design at the same time, fork & iterate 🔁 Design is an explorative process, by leveraging sub agent + parallel task capabilities, many interesting product UX can be built; Also turned this workflow into an open-source IDE extension here:
16:38

Cursor for Design? This Claude Code UI workflow is insane And many vibe coders not aware of it: 1. Claude Code can assign parallel tasks to sub agents 2. Integrate with git worktree to create sandbox env This means you can get Claude Code generate 10 design at the same time, fork & iterate 🔁 Design is an explorative process, by leveraging sub agent + parallel task capabilities, many interesting product UX can be built; Also turned this workflow into an open-source IDE extension here:

Jason Zhou

40,635 views • 1 year ago

My favorite Claude design hack right now: Create a prototype.md skill. Instead of one-shotting UI, I have Claude generate 5 variations for every feature in a single HTML file, side-by-side. I pick the winner. Claude builds it.
0:20

My favorite Claude design hack right now: Create a prototype.md skill. Instead of one-shotting UI, I have Claude generate 5 variations for every feature in a single HTML file, side-by-side. I pick the winner. Claude builds it.

Brett

179,344 views • 3 months ago

Build in Lovable, from Claude. New native integrations with our MCP server = chat to Claude, export from Claude Design, and ship with Claude Code, directly to Lovable. To get started, go to Claude → Click on the + sign → Connectors → Browse Connectors → Lovable.
0:39

Build in Lovable, from Claude. New native integrations with our MCP server = chat to Claude, export from Claude Design, and ship with Claude Code, directly to Lovable. To get started, go to Claude → Click on the + sign → Connectors → Browse Connectors → Lovable.

Lovable

74,146 views • 3 months ago

this is insane this guy dropped claude design, but open source with a real interactive editor works with Kimi.ai and DeepSeek the post already went viral with 276k views you don't need to pay that $200 for sure claude code -> omo claude design -> slides-grab
0:29

this is insane this guy dropped claude design, but open source with a real interactive editor works with Kimi.ai and DeepSeek the post already went viral with 276k views you don't need to pay that $200 for sure claude code -> omo claude design -> slides-grab

Sisyphus Labs

22,758 views • 3 months ago

great idea by Benji Taylor. i just added this into the design-plugin. claude will ask you what you want to design/refine and generate 5 variations. then you can leave comments directly on the elements for claude. 🔗
0:21

great idea by Benji Taylor. i just added this into the design-plugin. claude will ask you what you want to design/refine and generate 5 variations. then you can leave comments directly on the elements for claude. 🔗

0xDesigner

50,780 views • 8 months ago

Made this 30 second video of Claude Design just by pasting in the Claude Design blog post and some tweets from Anthropic employees Kinda speechless.
0:32

Made this 30 second video of Claude Design just by pasting in the Claude Design blog post and some tweets from Anthropic employees Kinda speechless.

Peter Yang

422,966 views • 5 months ago

I just recorded the COMPLETE CLAUDE 3D WEB DESIGN Course ❤️‍🔥 Dedicate 1 hour to this. The COMPLETE Claude AI Design Course teaches you to DESIGN and BUILD ANY 3D Game or Website. Those who watch it tonight will wake up tomorrow with a new skill. Watch it and save it to your favorites now.
59:56

I just recorded the COMPLETE CLAUDE 3D WEB DESIGN Course ❤️‍🔥 Dedicate 1 hour to this. The COMPLETE Claude AI Design Course teaches you to DESIGN and BUILD ANY 3D Game or Website. Those who watch it tonight will wake up tomorrow with a new skill. Watch it and save it to your favorites now.

Viktor Oddy

209,593 views • 1 month ago

This is how a top designer uses Claude as a design partner Every designer should copy this AI workflow to improve their designs Especially solo designers at startups or designers working on small teams because they don't have the luxury of weekly design critiques or colleagues available to give them immediate design feedback 👀 Watch the full interview on Sneak Peek: Hammed shows how the Jump design team uses Claude as a design thought partner to improve Figma designs👇
2:35

This is how a top designer uses Claude as a design partner Every designer should copy this AI workflow to improve their designs Especially solo designers at startups or designers working on small teams because they don't have the luxury of weekly design critiques or colleagues available to give them immediate design feedback 👀 Watch the full interview on Sneak Peek: Hammed shows how the Jump design team uses Claude as a design thought partner to improve Figma designs👇

Jayneil Dalal

82,240 views • 11 months ago

From Claude Design to Figma in 60 seconds: 1. In Claude Design: Present → New tab 2. Copy the link 3. Paste into Anima Agent 4. The agent renders it as editable Figma layers link 👇
0:36

From Claude Design to Figma in 60 seconds: 1. In Claude Design: Present → New tab 2. Copy the link 3. Paste into Anima Agent 4. The agent renders it as editable Figma layers link 👇

Anima

1,228,977 views • 5 months ago

Introducing the HyperFrames MCP in Claude Design The difference between prototyping a design and shipping it as video Animate in Claude Design, hit share, and hyperframes agent scores it, adds sfx, tightens the motion and renders the MP4 Just send it to HyperFrames. We'll take it from there.
0:45

Introducing the HyperFrames MCP in Claude Design The difference between prototyping a design and shipping it as video Animate in Claude Design, hit share, and hyperframes agent scores it, adds sfx, tightens the motion and renders the MP4 Just send it to HyperFrames. We'll take it from there.

HyperFrames

62,907 views • 1 month ago