---
title: "Magic UI"
description: "A collection of animated components and presentation patterns."
pagination: false
---

{/* Generated from content/. Edit the catalog, not this page. */}

<PurposeNote title="Good for">Building expressive landing pages and marketing interfaces.</PurposeNote>

## What it does

A collection of animated components and presentation patterns.

## When it fits

Building expressive landing pages and marketing interfaces.

## Other options in this category

<div data-pagefind-ignore>

- [canvas-confetti](/animation/canvas-confetti) — Adding a celebratory visual effect to successful actions.
- [Motion](/animation/motion) — Building transitions, gestures, and coordinated layout animation.
- [React Bits](/animation/react-bits) — Adding expressive visual sections and effects to a website.
- [React Simple Animate](/animation/react-simple-animate) — Adding straightforward animation sequences without a large animation setup.
- [react-glow](/animation/react-glow) — Adding pointer-responsive highlights to cards and other UI surfaces.

</div>

## Source

[Project source for Magic UI ↗](https://magicui.design/)

Editorial overview reviewed on October 24, 2026. Follow the source for current setup, compatibility, and licensing.

[Animate an interaction →](/tasks/animate-an-interaction)

[All animation &amp; effects options →](/animation)