Claude Design has no export button. The fastest way to get your animation as an MP4 is claude2video — paste your share link, download your video. No install, no code, no quality loss.
Why Doesn't Claude Design Have an Export Button?
Claude Design renders animations as React code running live in your browser. It's not producing a video file — it's running a mini web app. Anthropic hasn't built an export pipeline yet, so there's nothing to click.
That leaves three options: screen recording (fast but lossy), a developer CLI script (requires code), or claude2video (one step, no install).
Two Ways to Export with claude2video
Method 1: Paste the Share URL
- Open your project in Claude Design
- Click Share → open the shared link in a new tab → go fullscreen
- Copy the URL from your browser's address bar (the auth token is included)
- Paste it into the input on claude2video.com
- Hit Export to MP4 and wait for your download
Method 2: Replace the Domain (Faster)
Skip the copy-paste entirely:
- Open your Claude Design share link in the browser
- In the address bar, replace
claude.aiwithclaude2video.com - Press Enter
Before:
https://claude.ai/public/artifacts/abc123?token=xyz
After:
https://claude2video.com/public/artifacts/abc123?token=xyz
Everything else stays intact — the token, the parameters, all of it. claude2video picks them up automatically and starts the export.
Screen Recording vs. claude2video
Screen recording is the obvious first instinct. It works. Here's what you lose:
| Screen Recording | claude2video | |
|---|---|---|
| Quality | Compressed, visible artifacts | Full resolution, frame-by-frame |
| Gradients and transparency | ❌ Color banding | ✅ Accurate |
| Frame timing | ❌ Drops frames on fast animations | ✅ Every frame captured |
| Export speed | Real-time (must play the whole thing) | Faster than real-time |
| Install required | No | No |
| Manual effort | Timing, cropping, hoping nothing pops up | Paste URL, done |
If you're sharing something quickly and quality doesn't matter — screen recording is fine. If you want a clean file for social media, a presentation, or anything people will look at closely — use claude2video.
What About Doing It With Code?
If you're comfortable with a terminal, you can ask Claude Code to write a Playwright script that opens your animation in a headless browser and captures it frame by frame. It works well — but expect some back-and-forth to get it right, and you'll need Node.js and ffmpeg installed locally.
claude2video is the same idea, already built and ready to use.
What to Do With Your Exported MP4
- Post it on X, YouTube Shorts, or LinkedIn
- Drop it into a slide deck or presentation
- Share it in Slack, Discord, or email
- Build a portfolio of Claude Design experiments
Frequently Asked Questions
Does Claude Design have a built-in export button? No. Claude Design renders animations as live React code in the browser and has no native video export. claude2video fills that gap.
Is claude2video free? Yes, completely free. No watermark either.
Do I need to install anything? No. claude2video runs in the browser — paste your URL, get your file.
What video format does it export to? MP4. Plays on any device, uploads to any platform.
Will the quality be good? Yes. claude2video uses frame-by-frame capture directly from the browser rendering engine — the same quality you see in the tab, not a compressed screen recording.
How long does export take? Usually under a minute. Longer animations take a bit more time — a 10-second animation at 30fps is 300 frames to render.
Does it work on Mac and Windows? Yes. It's browser-based, nothing to install on either.
My animation has a token in the URL — is that safe to paste? The share token is generated when you click Share in Claude Design — it's the same URL you'd send to anyone. claude2video needs it to access the animation. It's not more sensitive than sharing the link itself.