Claude just got another superpower...

Fireship| 00:05:12|Apr 21, 2026
Chapters7
Introduces Claude Design and Opus 4.7, claiming it can convert designs into prototypes and production-ready UIs without traditional design tools, with market reaction noted.

Claude Design’s Opus 4.7 sounds revolutionary for turning designs into interactive UIs, but practical limits and speed questions still loom.

Summary

Fireship’s code report explores Claude Design on Anthropic’s Opus 4.7, spotlighting a tool that purportedly converts Figma designs into prototypes, UI, and even video-ready animations without traditional design software. Hasan or “the host” demonstrates uploading a design system via GitHub or a direct Figma file, then prompts Claude to auto-generate an iOS onboarding flow for a playful project called Horse Tinder. He notes Opus 4.7’s 3.75-megapixel image understanding (up to 2576px on the long edge) and a software engineering benchmark around 87.6%, while admitting the UI output sometimes ignores a user’s existing design system and can require manual tweaks. The video compares Claude Design’s speed and interactivity to rivals like Google Stitch, Codeex, and Cursor Composer, calling out fully interactive demos with working animations and shader-backed visuals. Despite impressive demos, Fireship emphasizes the demos are cherry-picked and shows the practical friction of “fixing” assets, color work, and logo clarity. The host also pushes back, attempting a hands-on build and acknowledging Opus 4.7 trails Google Stitch in speed but still beats human bloat, with future iterations (Opus 4.8) likely to close the gap. The segment closes with a plug for Google Cloud Run and Google AI Studio as a scalable backend path to deploy generated apps, underscoring a broader narrative: design automation is accelerating, but real-world polish and systematization still matter. It’s a brisk, provocative look at whether AI-led UI/UX is ready to supplant human-led workflows or merely augment them, ending with a push to try Google Cloud Run for free.

Key Takeaways

  • Claude Design on Opus 4.7 can understand images up to 2576 pixels on the long edge, enabling more accurate UI interpretation for design-to-prototype workflows.
  • Claude Design’s interactive demos include working animations and adjustable sliders, letting you preview multiple animation approaches for a single UI (e.g., a chat app).
  • Performance benchmarks cited place Opus 4.7 at about 87.6% on a software engineering metric, still behind some rival models like Mythos in certain tasks.
  • Output may ignore an uploaded design system some times, despite recognizing it, necessitating manual tweaks to align with branding and systems.
  • Compared to competitors (Google Stitch, Codeex, Cursor Composer), Opus 4.7 is slower but produces a more cohesive, interactive canvas, highlighting trade-offs between speed and polish.

Who Is This For?

Essential viewing for UI/UX designers and frontend developers curious about AI-assisted design tooling and the practical limits of auto-generated interfaces. It’s also relevant for product teams evaluating when to adopt AI design pipelines versus maintaining human-led workflows.

Notable Quotes

""Claude Design can easily put together a basic UI for you. But when it comes to interactivity, Claude pulls way ahead.""
The host contrasts Claude Design’s interactive capabilities with a Google Stitch baseline.
""The new model can now see images at 3.75 megapixels, which is huge for design work""
Highlights Opus 4.7’s improved image understanding.
""It can also produce these crazy futuristic animations by doing something that terrifies every web developer... working with shaders""
Emphasizes advanced animation capabilities and shader use.
""One issue, though, is that it didn't use my design system... it looks a lot more claudy than fire shippy""
Notes inconsistency with the uploaded design system in practice.
""Opus 4.7 is a lot slower than Google Stitch, Codeex, or Cursor Composer, but... a thousand times faster than a human""
Quantifies speed vs human production.

Questions This Video Answers

  • How fast is Claude Design Opus 4.7 compared to Google Stitch for UI generation?
  • Can Claude Design reliably maintain a design system when auto-generating 100+ screens?
  • What are the practical limits of 3.75 MP image understanding for design tasks?
  • Is AI-generated UI work production-ready or still requires human QA and tweaks?
  • How does Google Cloud Run integrate with AI-driven design pipelines?
Claude DesignOpus 4.7AI UI/UXFigma integrationGoogle StitchCodeexCursor ComposerDesign systemsWeb animations shaders
Full Transcript
In a shocking turn of events that absolutely nobody saw coming except for literally everyone, Anthropic just dropped what might be their most game-changing tool since Claude Code, Claude Design, a new Opus 4.7 powered platform that turns your halfbaked Figma designs into actual prototypes, pitch decks, and productionready UIs without the need to ever open a single design tool. The Figma stock dropped 7% within hours of the announcement. Longtime Adobe executives are just giving up and jumping out of high-rise windows. Every AI design startup just lost funding. And LinkedIn could barely keep its servers running because every junior UI designer was forced to do what every programmer had to do in 2023, update their job title to prompt engineer. In today's video, we'll look at all the crazy things Claude design can do and find out if this is the final nail in the coffin for humanled UIUX design. It is April 21st, 2026, and you're watching the code report. The claw design is built on Anthropic's brand new flagship model, Opus 4.7, which was just released last week and is allegedly more tasteful and creative than its predecessor, which is just corporate speak for we finally taught it that not everything needs a purple gradient. The new model can now see images at 3.75 megapixels, which is huge for design work because it can now understand images up to 2576 pixels on the long edge. Then for programming, it hit 87.6% 6% on the software engineering benchmark, which crushes Opus 4.6, but still falls behind the mysterious Mythos model. Despite these impressive Trust Me Bro benchmark results, a pretty loud group of people on the internet are not happy and say Opus 4.7 is actually a regression that there's even a conspiracy theory that they intentionally nerfed 4.6 over the last few months to make 4.7 feel smarter on the release date. And now, even though I believe in every conspiracy I've ever heard, I'm not so sure about this one because these demos are straight up off the chain. It's similar to Google Stitch, which I made a video about a few weeks ago that Claude Design can easily put together a basic UI for you. But when it comes to interactivity, Claude pulls way ahead. You notice all these demos are fully interactive. They've got working animations out of the box, and we can tweak all these sliders to get different results. In addition, it can give you a bunch of variations about how an animation should actually look. Like you might try out a bunch of different animations for a chat app. Or you could have it slop out a hundred different loading spinners to choose the one that fits best for your next failed side project. It can also produce these crazy futuristic animations by doing something that terrifies every web developer. And that of course is working with shaders. And this thing might even make video editors obsolete because it can even produce fulllength video animations over a minute long. Impressive. But the problem is that these are all cherrypicked pre-built demos. Let's find out if claw design is actually good by building something ourselves. Before you start building something though, you might already have your own design system in place. And like Google Stitch, you can upload a design system which will force it to maintain consistency between designs. The cool thing about Claude is that you can upload that design system by linking a GitHub repo or you can even upload a Figma file directly. And that's actually awesome if you're a designer because in theory it means you only have to design a couple screens. Then give Claude your Figma file and it designs the other 100 screens for you. Now I actually have my design system already set up as a PDF file which I'll go ahead and upload. Then I'll prompt Claude to build us an iOS onboarding flow for Horse Tinder. And now we just wait and wait and wait and wait. Opus 4.7 is a lot slower than Google Stitch, Codeex, or Cursor Composer, but at least it's still a thousand times faster than a human. But eventually it brings us to this canvas with five beautifully designed screens. Now, beautiful might be a bit of an exaggeration here, but it is a good starting point. One issue, though, is that it didn't use my design system. Even though it's recognized here in the chat output, it looks a lot more claudy than fire shippy. We can just ignore that, though, because another issue is that the horse tinder logo is all washed out. Well, another nice feature in Claw Design is that we can actually draw and comment on this canvas. Like, I can just draw an arrow directly to this crappy logo and then either comment it or just add a new prompt to fix it. Then 5 to 10 minutes later, it's magically fixed. Well, actually, wait a minute. It appears it didn't fix it. It just changed the background color a little bit. That's too bad. And I guess we'll have to wait for Opus 4.8 to come out before we can finally finish Horse Tinder. But the one thing we can continue working on is the backend using awesome tools like Google Cloud Run, the sponsor of today's video. It's a fully managed serverless platform that lets you run code on Google's worldclass infrastructure with zero overhead. You can use any language or framework to run front-end and backend services, batch jobs, or even host fine-tuned LLMs with GPUs, then deploy straight from your terminal or cloud code with a single command or set up continuous deployment from GitHub. You can also use Google AI Studio as a full stack development environment where you can vibe code a complete React or Node.js app, then deploy to Cloud Run with a single click. The best part is that it scales to zero, so idle projects don't cost you anything, and it autoscales to handle traffic spikes without any manual intervention. It also gives you 2 million free requests per month, so go try it out for free today at cloud.run. This has been the code report. Thanks for watching and I will see you in the next one.

Get daily recaps from
Fireship

AI-powered summaries delivered to your inbox. Save hours every week while staying fully informed.