ActiveAnimated componentssvelte219
@svelte-bits
Animated components · data updated 2026-07-28
An open source collection of high quality, animated, interactive & fully customizable Svelte components for building stunning, memorable user interfaces.
animationbackgroundscardsglassmorphismiconsmedianavigationretrotext-effects
Install
npx shadcn@latest add https://sveltebits.xyz/r/registry.jsonHealth
StatusActive
Last commit2 months ago
License—
Open issues1
ArchivedNo
Stars219
Components (128)
animated-contentantigravityblob-cursorclick-sparkcrosshaircubeselectric-borderfade-contentghost-cursorglare-hovergradual-blurimage-traillaser-flowlogo-loopmagic-ringsmagnetmagnet-linesmeta-ballsmetallic-paintnoiseorbit-imagespixel-trailpixel-transitionribbonsshape-blursplash-cursorstar-bordersticker-peeltarget-cursoraurorabalatroballpitbeamscolor-bendsdark-veilditherdot-fielddot-gridevil-eyefaulty-terminalfloating-linesgalaxygradient-blindsgrainientgrid-distortiongrid-motiongrid-scanhyperspeediridescenceletter-glitchlight-pillarlight-rayslightningline-wavesliquid-chromeliquid-etherorbparticlespixel-blastpixel-snow
Components: animated-content, antigravity, blob-cursor, click-spark, crosshair, cubes, electric-border, fade-content, ghost-cursor, glare-hover, gradual-blur, image-trail, laser-flow, logo-loop, magic-rings, magnet, magnet-lines, meta-balls, metallic-paint, noise, orbit-images, pixel-trail, pixel-transition, ribbons, shape-blur, splash-cursor, star-border, sticker-peel, target-cursor, aurora, balatro, ballpit, beams, color-bends, dark-veil, dither, dot-field, dot-grid, evil-eye, faulty-terminal, floating-lines, galaxy, gradient-blinds, grainient, grid-distortion, grid-motion, grid-scan, hyperspeed, iridescence, letter-glitch, light-pillar, light-rays, lightning, line-waves, liquid-chrome, liquid-ether, orb, particles, pixel-blast, pixel-snow, plasma, plasma-wave, prism, prismatic-burst, radar, ripple-grid, shape-grid, silk, soft-aurora, threads, waves, animated-list, border-glow, bounce-cards, bubble-menu, card-nav, card-swap, carousel, chroma-grid, circular-gallery, counter, decay-card, dock, dome-gallery, elastic-slider, flowing-menu, flying-posters, folder, glass-icons, glass-surface, gooey-nav, infinite-menu, magic-bento, masonry, model-viewer, pill-nav, pixel-card, profile-card, reflective-card, scroll-stack, spotlight-card, stack, staggered-menu, stepper, tilted-card, ascii-text, blur-text, circular-text, count-up, curved-loop, decrypted-text, falling-text, fuzzy-text, glitch-text, gradient-text, rotating-text, scrambled-text, scroll-float, scroll-reveal, scroll-velocity, shiny-text, shuffle, split-text, text-cursor, text-pressure, text-type, true-focus, variable-proximityPreview
Live sandbox previews render component source client-side. Where a component can’t be rendered standalone, sh4dcn falls back to its source and install command.
@svelte-bits · animated-content
npx shadcn@latest add https://sveltebits.xyz/r/animated-content.jsonView source