design-infraReport a problem or share feedback← Catalog
Animated Modal
curatedfreeaceternity/animated-modal
A customizable, compound modal component with animated transitions
$
npx shadcn@latest add @aceternity/animated-modalnpm deps: motion
Our notes
Compound modal with motion. For app dialogs prefer shadcn Dialog (accessible, themed).- Source
- Aceternity UI
- Kind
- component
- Categories
- modal
- Use as
- drop-in — replaces your component
- Applies to
- modal
- Motion
- on state · medium · motion · medium cost · ignores reduced motion
- Tags
- special, utilities
- Licence
- Free for unlimited personal & commercial projects; no redistributing as a competing library. Pro/All-Access is a one-time purchase.
- Live demo
- ui.aceternity.com
- Docs
- ui.aceternity.com
Similar
Compare all 4 →- Popover Formcult-ui/popover-formButton that morphs into a small inline form (feedback, waitlist). Text uses tokens but surfaces are bg-white / dark:bg-[#121212] plus blue accents — swap to bg-popover.
- Morphing Dialogmotion-primitives/morphing-dialogCard that morphs into a dialog (shared layout) — the signature motion-primitives piece for galleries/case studies. Only the backdrop has colour (white/black 40%); you style the card with tokens.
- Dialog: modal, command, comboboxoriginui/comp-333Command palette (command + dialog) with search — pair with comp-25 as the trigger and bind ⌘K yourself.