Magic by 21st.dev

Introducing Magic

Craft with AI
UI Components

Create components with your team's taste, not generic AI patterns. Available as MCP server or web interface.

20,114+ people using Magic
Magic Agent Demo

Supported IDEs

Use Magic with your favorite IDEs

Powerful Features

Everything you need to build modern UI components

Add New Components

Add New Components

Create UI components by describing what you need. Magic generates production-ready code instantly.

Enhance Existing UI

Enhance Existing UI

Improve components with advanced features and animations. Upgrade without starting from scratch.

SVGL Integration
Access Logo Library

Access Logo Library

Integrate company logos and icons via SVGL. Access a vast collection of professional brand assets.

How It Works

Craft components with your unique style in three simple steps

Describe Your Vision

Describe Your Vision

Simply tell the AI Agent what component you need by typing /ui and describing your idea - whether it's a pricing table, contact form, or navigation menu.

Choose from Options

Choose from Options

Magic generates three unique variations of your component. Review them and select the one that best matches your needs and design preferences.

Instant Integration

Instant Integration

Your IDE's AI Agent automatically integrates the chosen component into your project, handling all the necessary files and dependencies seamlessly.

Frequently Asked Questions

Everything you need to know about Magic AI Agent