Introducing Magic
The AI Agent That Builds Beautiful UI Components
Empower your IDE with an AI extension that creates stunning, production-ready components inspired by 21st.dev
Supported IDEs
Use Magic with your favorite IDEs
Powerful Features
Everything you need to build modern UI components
Add New Components
Create UI components by describing what you need. Magic generates production-ready code instantly.
Enhance Existing UI
SoonImprove components with advanced features and animations. Upgrade without starting from scratch.
Access Logo Library
Integrate company logos and icons via SVGL. Access a vast collection of professional brand assets.
How It Works
Create beautiful UI components in three simple steps
Tell Agent What You Need
In your AI Agent's chat, just type /ui and describe the component you're looking for—maybe a waitlist form or a login page.
Let Magic Create It
Your IDE (e.g., Cursor) prompts you to use Magic. Magic then instantly builds a polished UI component, inspired by 21st.dev's library.
Seamless Integration
With a single click, Magic adds the new files directly into your project, so you can start using your brand-new UI right away.
Pricing
Choose the plan that best fits your needs
Hobby
Perfect for trying out
- 5 generations per month
- Access to basic components
- Access to SVGL logo library
- Community support
Standard
For professional developers
- 50 generations per month
- Access to all components
- Access to SVGL logo library
- Priority support
- 50% of revenue goes to component authors
Pro
For power users
- 200 generations per month
- Access to all components
- Access to SVGL logo library
- Priority support
- 50% of revenue goes to component authors
Frequently Asked Questions
Everything you need to know about Magic AI Agent