Magic - AI Agent for Your IDE That Creates Professional UI Components | 21st.dev | 21st.dev

Supported IDEs

Use Magic with your favorite IDEs

CursorWindsurf+VS Code + Cline

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

Soon

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

SVGL Integration

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.

Frequently Asked Questions

Everything you need to know about Magic AI Agent