Magic Patterns - AI Tools Nav

What it is for

Magic Patterns is a prompt-to-UI canvas: the official editor still (see the cover: Create → Design prompt, Preview, and Screens) is the product. Use it when the job is a clickable React prototype from a brief.

License is hosted commercial. Free prints $0 / month. Starter is the first public paid card.

What makes it unique: the cover is Magic Patterns’ own design editor — prompt, live preview, Screens — from the official Get started with a design guide, a product canvas rather than a marketing hero.

Key features

Create → Design — prompt box, optional screenshot attach, then Preview (quickstart).
Screens / Code — switch the same generation between page grid and source (cover).
MagicOS canvas — designs, docs, images, and GitHub repos on one board (canvas).
GitHub sync — pull a repo onto the canvas and push UI back.
MCP — let an external agent drive the editor.
Export — copy generated React out of the prototype.

Who it's for

Best fit: PMs and designers who want a working prototype in the browser and will spend a monthly credit pool.

Pricing

Verified 2026-10-22 (Asia/Shanghai) from the live annual cards on magicpatterns.com/pricing and the Credits and Plans table. Displayed dollars can vary by region at checkout.

Free — $0 / month. Free monthly credits.
Starter — $20 / seat / month or $17 / seat / month billed annually. 1,000 monthly credits; watermark off; on-demand; GitHub / MCP.
Business — $100 / seat / month or $85 / seat / month billed annually. 5,000 monthly credits; SSO; usage reporting; 10+ user workspaces.
Enterprise — custom (credit pools, SCIM, TAM).
On-demand — $0.02 per extra credit on paid plans.

The pricing header toggle prints Annual (15% off). Unused monthly credits roll over for one month.

Limitations / costs

Credits scale with iterations. A 21–50 version project is listed at ~950 credits.
On-demand starts on paid seats after the monthly pool.
Plans attach to a workspace, so one account can sit on Free and paid workspaces at once.
Enterprise is quote-only.

Alternatives

v0 by Vercel — React/shadcn generation with a Vercel deploy path.
Lovable — full-stack app builder from a prompt.
Figma AI — AI inside a design file you already edit.

Official tutorial

Written path: Get started with a design plus Credits and Plans and Pricing.

Website

https://www.magicpatterns.com

Source

Catalog row curated for AI Tools Nav. Cover is Magic Patterns’ official editor still from the Get started with a design guide. Dollars checked on magicpatterns.com/pricing (Free $0; Starter $20 / $17 yr; Business $100 / $85 yr; on-demand $0.02). Tutorial: official editor quickstart.

Last verified

2026-10-22 (Asia/Shanghai) editorial check.