Svelte 5 Animations

Beautiful, copy-paste animation components for Svelte 5. Built with motion-sv, Tailwind CSS and Shadcn Svelte registry.

New Stuff

• 21 new Spell UI animation components
• Now shipping 78 total components across both libraries

What's Included

1. Svelte Magic UI - 57 animation components
2. Svelte Spell UI - 21 animation components

Browse the library:

• Main docs: sv-animations.vercel.app
• Spell UI: sv-animations.vercel.app/spell

Quick Start

pnpm dlx sv create my-app
# select tailwind css option
pnpm dlx shadcn-svelte@latest init
pnpm add motion-sv

Install a component:

pnpm dlx shadcn-svelte@latest add https://sv-animations.vercel.app/r/morphing-text.json

Registry Structure

Use /r/ for Magic UI components Use /s/ for Spell UI components. Use /f/ for Fancy Components (building...).

Credits

• Hanielu - For creating the amazing motion-sv library that powers these animations.
• Magic UI - For inspiring the design and concept of the Magic UI components.
• Spell UI - Thankyou Tom 😊
• Fancy Components - I Love your work a lot Daniel 😊

Original Creators

• Tom : Creator of Spell UI
• Daniel Petho : Creator of Fancy Components
• Dillon Verma : Creator of Magic UI

my project is inspired from above original creators work, my goal is to bring similar animation components to svelte 5 community.

Support

• Open issues: Create New Issue / Report the Bug
• Sponsor the project: GitHub Sponsors

License

MIT License. See LICENSE for details.