I Built My Entire Design System in 4 Hours With AI. Full Tutorial (Claude + Cursor + Figma)
253K views · 28 Nov 2025
Comments · 204
@thedesignproject · 11 months ago · pinned
Hey everyone! I realized my video is off sync in some parts. Sorry about that, still learning!
89
@woshiairy · 8 months ago
It seems like you built a DS documentation website with Figma MCP & Claude, not the DS itself you stated on the title. It is kind of misleading.
95
@khalil_daily · 6 months ago
OMG An entire new design system in 4hours? <br> <br>✅ content <br>❌ real world project
12
@Weeblewobb · 10 months ago
Faster...faster....faster...it will never be fast enough.
246
@steviek8733 · 9 months ago
I think I need a tutorial on Claude first and then how to connect figma and Claude and how to set up environments 😅
75
@EsculachoPolítico-k1o · 7 months ago
I shipped an entire design system in five minutes — just opened an existing one, changed the colors, and voilà. <br>Now the brand that once focused on building its identity looks exactly like 99.99% of other companies chasing quick results thinking they will be the next google.
1
@andydenham9665 · 9 months ago (edited)
Great examples and video. I haven't succeeded in creating accurate enough coded components yet, so helpful to see what you've done. Although, from my opinion, what you have built is a Component Library not a Design System.
25
@sammiller9855 · 11 months ago
Great. Please, consider putting the prompts in the video description
65
@stooopidasss · 3 months ago
So you aren't really building from scratch, you have a design library already in Figma that you are just converting to code? The design library components in the first place is really the hard part!
2
@Johnfeere · 8 months ago
Lmao “hey i made some shit up” is a great concept for a video
17
@MR.Fusilli · 7 months ago
I will never be convinced that this is areal person
1
@KostiantynHladkov · 11 months ago
Wow. That is an awesome practical guide. Thank you!
3
Up next
From Figma to Storybook: Build Components AI Can Actually Use
The Design Project · 10K views
Build a Figma Design System With AI and Code
The Design Project · 36K views
Design with AI - Full Guide (Tools, Workflows, Design Systems)
UI Collective · 133K views
Don't Build a Design System from Scratch (Advanced Claude Code + Figma Workflow)
The Design Project · 11K views
Design Will Never Be The Same
uxcon vienna · 78K views
Full Tutorial: From Design to Code with Claude Code in 40 Minutes | Meaghan Choi
Peter Yang · 39K views
Design Systems for Beginners (Claude Code + Figma)
The Design Project · 38K views
Designing With AI: Claude, Codex, Figma | Full Guide
UI Collective · 233K views
How to Design with Claude + Figma | Complete AI-Native Workflow
AI Design Professor | Nehmat Gereige · 13K views
Design.md: How to make your design system work with AI
The Design Project · 21K views
mattpocock/skills: A complete AI Coding workflow, end-to-end
Matt Pocock · 826K views
Learn Design Systems: Figma Variables, Components, AI, and More
UI Collective · 104K views
How to scale intent, quality, and artistry with Al | Katie Dill (Stripe)
Lenny's Podcast and Stripe · 635K views
Claude + Figma = Design System Components
Sergei Chyrkov · 60K views
Use Claude to Generate a Design System in Figma
David Klein · 42K views
Build a Real Design System with AI, and Prototype With It in Code (Figma, Claude, MCP & Storybook)
moonlearning · 4K views
The AI workflow every product designer should know
femke.design · 14K views
How to build a design system from scratch with Claude Code
02ui - Idea to Product · 40K views
AI + Design Systems: The Honest Truth Nobody’s Telling You
UI Collective · 26K views
Figma Design System + Screens using Claude Code - FULL COURSE
Average Design Dude · 29K views