Figma design vs Claude Code output Here's my workflow:... → Built the component on shadcn/ui foundations → Wrote a SKILLS.md file that systematized design-token extraction (included inputs, extraction protocol, tech selection, tailwind rules, layout etc) → Fed Claude the Figma CSS + 2x-scaled component PNGs (halved the measurements) → Iterated bit-by-bit in Claude Code until I as satisfied with the outputshow more

🚨 BREAKING: Claude can now turn your Figma file... into a live app. Vibe code from any Figma design...show more

We've released a new frontend-design plugin for Claude Code.... Here's Claude's output for: "use the frontend design skill. Create a music player app."show more

Day 140 of vibe-coding as a designer. I'm shocked... how few designers know about this workflow. I skipped Figma and made a beautiful Robinhood design from Claude Code + Paper, in just one prompt. Wild! 🤯 This feels like the future of design.show more

I made this entire video using Claude Design. And... the output is insane. 🤯show more

Built and published the fictional design agency archive from... day 12 using Claude Code + Figma MCP. Claude got the project surprisingly close very quickly, but the final polish still came down to human direction, especially around motion, depth, blur, and interaction feel. Live link in thread.show more

Claude Code on desktop lets you select DOM elements... directly, much easier than describing which component you want updated! Claude gets the tag, classes, key styles, surrounding HTML, and a cropped screenshot. React apps also get the source file, component name and propsshow more

Publish Workflow – built with Claude Code

Claude Design + Shopify is f*cking ridiculous 🤯 You... can now publish pages from Claude Design → Claude Code → Shopify. Built 100% with Claude Design, Claude Code, and the Shopify CLI. Perfect for DTC brands and agencies who want to skip the design → dev handoff entirely. Here's how it works: → Design any landing page in Claude Design → Export as a zip and drop it into Claude Code → Install the Shopify + Shopify AI Toolkit plugins → Prompt Claude to convert the HTML into a Shopify page template + push to live theme → Claude uploads the images, deploys the files, and creates a published page No more handing designs off to a dev and waiting 2 weeks for a Shopify page. What you get: - A workflow that turns any Claude Design page into a real Shopify page template - Editable sections so your marketing team can swap copy, images, and CTAs without code - Images uploaded straight to Shopify Files automatically - A files-only deploy that only touches what's new in your live theme - A repeatable pipeline you can use every time you design a new landing page This is essentially the design-to-deploy pipeline brands have been waiting for. I put together a step-by-step playbook for going from Claude Design → published Shopify page. Every install, every plugin, every command, and the exact prompt that runs the whole thing. Want the playbook for free? > Like this post > Comment "SHOP" And I'll send it over (must be following so I can DM)show more

Built this with the new shadcn CLI MCP +... Namespaced registry and Claude Code in around 5 minutesshow more

watching Figma, a $10B UX design monopoly, melt down... with a single Claude tweet.show more

Introducing Generative UI for MCP Apps One server. Infinite... interfaces. Instead of building views, define a component catalog. The AI assembles the right UI based on your API, CLI or MCP server tools. Works in Claude, ChatGPT, VS Code, Cursor and moreshow more

This would have taken me forever without Claude AI... I constantly get impressed by how far I can take concepts I had in my head to a functional component in a couple of hours. Normally, I'd spend just that amount of time designing in Figma. Now, I completely skip Figma and go straight to code. Designing in code is back and I love every minute of it.show more

a great way to get started is to use... our skill, built into Claude Code. get the latest Claude Code release: $ claude update then start Claude Code and run our subcommand: $ claude /claude-api managed-agents-onboardingshow more

Continuing the silliness in Claude Code. Keeping with the... Wireframe Design Studio theme and added these cyan grid/content indicators that snap to the content.show more

Spent a few hours in Claude Code again this... morning working on a new design for Wireframe Design Studio. I didn't write a single line of code.show more

Shipping my personal site today.. built with a combination... of Claude Code, Codex, and Figma MCP! I'm rolling it out with small bits around how we shipped UI3. More to come in the following weeks!show more

a project i've been excited about: make Claude Code... better at using the Claude API. just ask Claude Code about Claude API features (e.g., prompt caching, adaptive thinking + effort, tools, etc).show more

Go from design to Compose UI code with Gemini!... ⬆️ Upload image of app UI screen ↪️ Use the prompt in the blog ↪️ Copy output into Android Studioshow more

Announcing Built with Opus 4.6: a Claude Code virtual... hackathon. Join the Claude Code team for a week of building. Winners will be hand-selected to win $100K in Claude API credits. Apply here:show more

Say hi to the Kibo UI QR Code shadcn... component! 🔠 Pass in any string 💪 Adjustable level of robustness 🎨 Customizable styling 🧠 Works with the new OKLCH CSS variables 💻 React Server Component available ↔️ Infinitely scalable SVG Link 👇🧵show more