Svelte Animations

Home
Changelog

Command Palette

Search for a command to run

Getting Started

Overview
Introduction
Installation

Components

Animated List
Avatar Circles
Bento Grid
Dock
Dotted Map
Flow New
Globe
Hero Video Dialog
Icon Cloud
Lens
Marquee
Orbiting Circles
Pointer
Progressive Blur
Smooth Cursor
Glyph Matrix

Special Effects

Animated Beam
Animated Theme Toggler
Border Beam
Glare Hover New
Magic Card
Meteors
Shine Border

Animations

Blur Fade

Text Animations

Animated Gradient Text
Animated Shiny Text
Aurora Text
Dia Text Reveal
Hyper Text
Line Shadow Text
Morphing Text New
Sparkles Text
Text Animate
Video Text

Buttons

Rainbow Button
Ripple Button
Shimmer Button

Backgrounds

Animated Grid Pattern
Dot Pattern
Flickering Grid
Grid Pattern
Hexagon Pattern
Light Rays
Noise Texture New
Retro Grid
Ripple
Striped Pattern

Other

Animated Circular Progress Bar
Arc Timeline
Backlight New
Cool Mode
Dither Shader
File Tree
Interactive Hover Button
Motion Grid Beta
Neon Gradient Card
Number Ticker
Pixel Image New
Pulsating Button
Scroll Progress
Typing Animation
Warp Background
Word Rotate Beta

Svelte Magic UI

50+ Free and Open-Source animated components and effects Built with Svelte 5, Typescript, Tailwind CSS V4 and Motion Svelte.

View Components Sikandar JODD

Sikandar JODD

Sponsor My Work

Dia Text Reveal

Learn to build faster

Line Shadow Text

Ship faster

Pixel Image

Pixel image piece 1

Pixel image piece 2

Pixel image piece 3

Pixel image piece 4

Pixel image piece 5

Pixel image piece 6

Pixel image piece 7

Pixel image piece 8

Pixel image piece 9

Pixel image piece 10

Pixel image piece 11

Pixel image piece 12

Pixel image piece 13

Pixel image piece 14

Pixel image piece 15

Pixel image piece 16

Pixel image piece 17

Pixel image piece 18

Pixel image piece 19

Pixel image piece 20

Pixel image piece 21

Pixel image piece 22

Pixel image piece 23

Pixel image piece 24

Pixel image piece 25

Pixel image piece 26

Pixel image piece 27

Pixel image piece 28

Pixel image piece 29

Pixel image piece 30

Pixel image piece 31

Pixel image piece 32

Pixel image piece 33

Pixel image piece 34

Pixel image piece 35

Pixel image piece 36

Pixel image piece 37

Pixel image piece 38

Pixel image piece 39

Pixel image piece 40

Pixel image piece 41

Pixel image piece 42

Pixel image piece 43

Pixel image piece 44

Pixel image piece 45

Pixel image piece 46

Pixel image piece 47

Pixel image piece 48

Pixel image piece 49

Pixel image piece 50

Pixel image piece 51

Pixel image piece 52

Pixel image piece 53

Pixel image piece 54

Pixel image piece 55

Pixel image piece 56

Pixel image piece 57

Pixel image piece 58

Pixel image piece 59

Pixel image piece 60

Pixel image piece 61

Pixel image piece 62

Pixel image piece 63

Pixel image piece 64

Orbiting Circles

Stack

Aurora Text

Build with Svelte

Animated Gradient Text

🎉

Introducing Svelte Magic UI

Morphing Text

Shimmer Button

Dotted Map

Border Beam

Bhide Svelte

Bhide Svelte

I Love Svelte, Animations and Art.

Animations Marketing Dot Matrix Design Systems