Figma AI Design-to-Code (React + Tailwind Export) vs Vercel AI SDK 5.0

“The primitive here is: AST-to-JSX transpilation with Tailwind class inference from Figma's internal constraint model. That's actually a non-trivial technical problem and Figma has the structural data advantage — named auto-layout frames, component instances, design tokens — that a scraper-based tool never would. But the DX bet is wrong: 'one-click export' buries the real question, which is whether the output composes cleanly into a real codebase or produces a flat wall of inline Tailwind classes that you immediately refactor. Every code-gen tool I've used produces components that are correct at pixel-level and wrong at architecture level — no prop interfaces, no variant logic, no state. If Figma ships actual component props derived from Figma variants and real token references instead of hardcoded hex strings, I'll revisit. Until I see a public code sample of a non-trivial component output, I'm calling this a well-resourced demo.”

“The primitive here is clean: a typed MCP client baked into the SDK so you stop writing adapter glue between your tool-calling loop and whatever MCP server you're pointing at. The DX bet is that complexity lives in the framework layer, not your application code — and for multi-turn tool-use that's exactly the right call, because the state management across turns is genuinely tedious to get right by hand. First 10 minutes: `npm install ai@5`, hook up a provider, and your streaming UI component actually reacts to partial tool responses without a custom event-bus hack. The weekend alternative dies here — you *can* wire Anthropic's API directly with SSE and a tool-call loop, but the streaming UI primitives alone would take a weekend to get right, and you'd be re-implementing what Vercel just shipped. The specific decision that earns the ship: multi-turn tool state is managed as first-class SDK state, not left as an exercise to the reader.”

“Category: design-to-code, competing directly with Anima, Locofy, Builder.io, and — honestly — just copy-pasting a Figma frame into v0. The specific scenario where this breaks is any design that wasn't built with dev handoff in mind: inconsistent component naming, mixed auto-layout and absolute positioning, custom illustrations as vector groups. That describes roughly 80% of real production Figma files. The 12-month killer here is v0 and Lovable — they generate React+Tailwind from a text prompt or screenshot and don't require a well-structured Figma source file at all. What would earn a ship: public examples of generated code from messy real-world files, plus evidence that the output passes a real TypeScript strict-mode check without modification.”

“Direct competitor is LangChain.js plus custom streaming, and Vercel beats it on one specific axis: the streaming UI primitives integrate with React's component model without you building a custom hook every time. The scenario where this breaks is any team not already in the Next.js/React ecosystem — the 'works with other frameworks' claim is technically true but the ergonomics are clearly optimized for Vercel's own stack, and you will feel that friction in Svelte or Vue. What kills this in 12 months isn't a competitor — it's Anthropic and OpenAI shipping first-party SDKs with equivalent streaming primitives, which both companies have already signaled interest in. What would have to be true for me to be wrong: Vercel compounds the SDK's network effects faster than model providers ship their own tooling, and the MCP ecosystem grows large enough that the client integration becomes genuinely load-bearing infrastructure rather than a convenience shim.”

“The interaction model here is the right one: export lives inside the tool where the design already exists, not in a third-party plugin with its own auth flow and separate pricing. The real design question is whether the output respects the Figma component hierarchy — if a Button variant system in Figma becomes a proper React component with a variant prop rather than four separate exported components, that's a genuine system-level design decision that most competitors get wrong. The gap I'd watch: what happens to design tokens? If spacing and color values get baked as arbitrary Tailwind values like `p-[13px]` instead of referencing a token system, the design system thinking stops at the boundary of the export and you've just moved the inconsistency downstream.”

“The job-to-be-done is sharp and singular: eliminate the re-implementation step where a frontend engineer recreates what the designer already built. That's a real, expensive, recurring job that every product team has. The completeness question is where it gets complicated — a user can export a component, but can they actually retire Storybook, their existing component library, and their manual handoff Slack thread? Probably not yet, which means this is a complement to existing workflow, not a replacement, which makes it a weak ship. The specific product decision that earns the ship anyway is distribution: this ships to every Figma Professional user by default with no install, no plugin, no new tab — that's a forced-adoption wedge that third-party competitors cannot match, and adoption by inertia is still adoption.”

“The thesis this SDK bets on: MCP becomes the USB-C of AI tool connectivity — a sufficiently standardized protocol that the value shifts from writing integrations to composing them, and that shift happens at the framework layer before it happens at the application layer. That bet is early-to-on-time; MCP adoption among tooling vendors accelerated sharply in the past six months and the alternative (every app rolling bespoke tool schemas) is visibly painful. The second-order effect nobody is writing about: if the MCP client becomes the default way Next.js apps consume tools, Vercel gains ambient observability over what tools enterprises are running in production — that's a data position, not just a developer experience win. The dependency that has to hold: MCP doesn't fragment into provider-specific dialects the way REST did before OpenAPI, because if it does, a single client abstraction becomes a compatibility matrix and the whole premise collapses.”

“The buyer here is the engineering team at a mid-market SaaS company building AI features on Next.js, and the budget comes from the infrastructure line because deployment follows the SDK naturally onto Vercel's platform — this is a classic open-core land where the free SDK is the top-of-funnel for paid compute. The moat is workflow lock-in: once your streaming UI components are built against Vercel's primitives and your MCP client config is in your Next.js project, migrating off is a rewrite, not a config change. The stress test that matters: when OpenAI ships a first-party streaming UI library with GPT-5-level defaults, does this SDK still justify itself? Yes, but only if the multi-provider abstraction layer stays meaningfully ahead of what any single model provider ships — right now it does, but that lead compresses every quarter. The specific business decision that makes this viable: Vercel is giving away the SDK to own the deployment surface, and that trade is still correct.”