Claude Design Looks Great — But It Devours Your Token Limits. Here’s How to Use It Smartly

Claude Design Looks Surprisingly Good — But It Eats Through Your Limits Fast. Here Are 7 Pro Tips Straight from Anthropic’s Designers

Claude Design Looks Great — But It Devours Your Token Limits. Here’s How to Use It Smartly Anthropic just dropped Claude Design — a new AI-powered tool for creating prototypes, pitch decks, one-pagers, and branded visuals by simply talking to Claude. Powered by the latest Claude Opus 4.7 vision model, it finally lets you escape the classic green-and-blue “AI coding vibe” and produce designs that actually feel on-brand and polished.

The good news? It looks genuinely delightful and productive.
The not-so-good news? Setting up your design system and core screens can burn through token limits like crazy, especially on Pro or Max plans.

Ryan Mather, a designer on Anthropic’s verticals team who works across seven different products, shared his hard-earned tips for getting the most out of Claude Design without wasting your quota.

Here’s the playbook:

1. Invest Time Upfront: Build Your Design System and Core Screens First
Spend that first hour (or two) setting up your full design system and key reference screens. It feels painful at the beginning, but it pays off tenfold.

Once Claude has your colors, typography, components, spacing rules, and core layouts locked in, it stops guessing and starts respecting your visual language. You’ll waste far fewer prompts explaining “make it look like our brand” on every new screen.

2. Iterate Live with Engineers
One of the biggest superpowers: you can design an entire new feature in a single meeting with an engineer.

Because Claude generates mockups extremely quickly, the conversation stays high-level — focused on concepts, user flows, and technical constraints — instead of “I’ll go make something in Figma and show you later.” Ideas come to life in real time, and everyone stays aligned.

3. Use Inline Comments for Surgical Edits
After the first rough draft, you’ll inevitably spot dozens of small details that need fixing.

Don’t waste time describing every tweak verbally or in long prompts. Just point at the element and leave a comment with your critique. It’s faster, more precise, and Claude handles the changes much more accurately.

4. Ask Claude to Create Video Demos of Your Ideas
Stop thinking of Claude Design as a traditional canvas tool like Figma.

It’s closer to Claude Code than a pixel-pushing editor. Ask it to generate interactive prototypes, animated flows, or even short video demos of how the interface should behave. It can do almost anything you can imagine — treat it like an agent, not just a drawing board.

5. Connect Your Docs and Slack (and Other Tools)
Once everything is set up, the real magic begins.

You can prompt things like: “Read the notes from yesterday’s product roast meeting and create a deck with design solutions for every issue that came up.” Then go for a walk, come back, and review with fresh eyes. Connectors turn Claude Design into a true workflow accelerator.

6. Build Custom One-Off Tools on the Fly
Don’t try to force Claude Design into your old Figma workflow — it’s a completely different beast with its own superpowers.

Experiment wildly. Ask it to create bespoke tools or controls tailored to your current task. The more you lean into its agentic nature, the more you’ll find yourself designing circles around traditional methods.

7. Know When to Slow Down and Do It by Hand
Speed is addictive, but not everything benefits from hyper-fast AI generation.

Details like custom icons, spot illustrations, microcopy, and naming often have an outsized impact on the final product feel. Learn to recognize when it’s worth stepping back from “agent mode” and crafting something manually. Knowing when to slow down is its own design skill.