My AI-Native Design Stack (and why I'm not married to any of it)
The tools I ship with right now, and the philosophy underneath why none of them are permanent.
There's a version of this article that's just a list of tools. This isn't that.
Yes, I'll tell you exactly what I use and why. But the more important thing to understand is the philosophy underneath it — because the stack is just evidence of a way of thinking. And that way of thinking is what actually matters.
Here's what I ship with right now.
Ideation — Paper & MagicPath
Everything starts either on Paper or in MagicPath.
Paper — via the Paper MCP — is where raw concepts live. I generate ideas on a canvas, explore directions quickly, and when something clicks I can convert it directly into functional code. The shader capabilities and AI image generation make it genuinely useful for branding work too — concepts, directions, visual language, all without leaving the tool.
MagicPath handles something different — direct React component generation. When I have a clear direction and need to see it rendered fast, MagicPath gets me there without the overhead of traditional design tools.
Neither of these replaced Figma. They made Figma mostly irrelevant for how I work.
Building — Cursor, Claude Code & Codex
My primary environment for almost everything — my portfolio, AI Design HQ, PharmAppy's website. Any project where I need full control over the codebase, the architecture, and the output.
All three operate in similar territory — agentic coding that lets me move from design decision to shipped code without handoff. Cursor is my preference. It's the most mature of the three, has the best design mode, and is where I spend most of my time. Claude Code and Codex earn their place on specific tasks and workflows where they have an edge.
Also in the building toolkit:
Lovable — for smaller projects and anything that needs native backend functionality or AI features baked in from the start.
Framer — one traditional tool that still has a job. If a client needs to edit their own content or manage their site without touching code, Framer is the right call. That's its lane.
Dialkit — excellent for tweaking anything with a variable property. Fast, precise, stays out of the way.
Agentation — click anywhere on a page, describe the change you want, hand it to the AI agent. Removes the friction of explaining context every time.
Branding & Assets — Figma & Paper
Figma still earns its place here. For branding work, logo creation, and marketing assets it remains the right tool.
Paper handles concept generation — shaders, AI image generation, visual direction — particularly useful when I want to explore before committing to a direction in Figma.
Why none of this is permanent
Here's the thing about everything I just wrote: it'll probably look different in 6 months.
Not because these tools are bad. Because better ones will exist, or the existing ones will evolve, or I'll find a workflow that makes something I currently use redundant. That's the nature of building in this moment.
I watched a designer recently post a "Framer vs Claude" comparison where he spent 12 hours in Framer and a fraction of that in Claude, then declared Framer the winner. The comments agreed. The test was meaningless — uncontrolled variables, predetermined conclusion — but more than that, the whole frame was wrong.
The question was never which tool is better. The question is: what are you trying to achieve, and what gets you there fastest without compromising quality?
Some days that's Framer. Some days that's Lovable. Some days that's a sheet of paper and a conversation with Claude.
The designers who are going to matter are tool agnostic. Curious, honest about what each tool is good for, and loyal to the outcome — not the workflow.
The stack is just how I get there today. If you're figuring out your own version of this, I built a simple starting point for that at AI Design HQ.
Use the AI Design HQ stack finder