Magic Patterns vs Onlook
A side-by-side comparison of Magic Patterns and Onlook, two Design tools, drawn from Ignaite's continuously-verified listings.
Compared from listings verified as of
Magic Patterns
DesignAI prototyping for product teams — generate UI in your own design system.
View Magic PatternsAt a glance
| Attribute | Magic Patterns | Onlook |
|---|---|---|
| Category | Design | Design |
| Pricing | FREEMIUM | FREEMIUM |
| License (differs) | Proprietary | Open core |
| Deployment (differs) | Cloud | Hybrid |
| Platforms | Web | Web |
| Model support (differs) | — | Multi-model |
| Vendor (differs) | North Park Labs | Onlook |
| Capabilities |
|
|
The honest brief
Magic Patterns
Generates prototypes inside your own design system — imported from Figma, Storybook, or any site — instead of generic AI mockups.
- Prototypes you can test and hand off
- Figma and Storybook component import
- Free tier to start
- Built for team collaboration
- Business tier jumps to $100/seat/month
- Web-only, no desktop app
Onlook
Edits your real Next.js + Tailwind code visually on an infinite canvas, keeping the codebase as the source of truth instead of exporting throwaway markup.
- Free to self-host
- Edits real code, not exports
- AI assistance for larger changes
- Works with Next.js, Tailwind, shadcn
- Hosted cloud pricing not public
- Scoped to the React/Next.js stack
- Young project (YC W25)
When to pick which
Onlook leans on Code generation as a headline capability; Magic Patterns treats it as secondary.
- Code generation (primary capability)
They also differ on:
- License
- Proprietary · Open core
- Deployment
- Cloud · Hybrid