ActiveAnimated componentspro available44
@velora
Animated components · MIT · data updated 2026-10-10
100 animated React components and 31 free section blocks for Tailwind CSS 4 — accessible, reduced-motion safe and MIT licensed.
3daccessibilityanimationbackgroundsblocksbuttonscardsdashboardformsiconsloadersmapsmarketingmedianavigationoverlayspro-availableretrotext-effectstheming
Install
npx shadcn@latest add https://velora.colorlib.com/r/registry.jsonHealth
StatusActive
Last commit1 week ago
LicenseMIT
Open issues0
ArchivedNo
Stars44
Components (131)
aurora-backgroundbackground-beamsbackground-boxesdotted-glow-backgroundflickering-gridgrid-patternlamplight-raysmeteorsnoise-backgroundparticlesretro-gridrippleshooting-starsvortexwavy-backgroundanimated-gradient-textflip-wordshyper-textmorphing-textnumber-tickersparkles-texttext-highlightertext-hover-effecttext-revealtext-shimmertypewriterword-rotateconfettimagnetic-buttonmoving-borderrainbow-buttonripple-buttonshimmer-buttonstateful-buttontheme-toggleranimated-listanimated-tooltipavatar-circlesbento-gridcard-hover-effectcard-stackcompare-sliderdirection-aware-hoverdockdraggable-cardevervault-cardexpandable-cardfile-treefocus-cardsglare-cardlayout-gridmarqueeorbiting-circlesspotlight-cardtilt-cardwobble-cardanimated-sidebaranimated-tabsfloating-navbar
Components: aurora-background, background-beams, background-boxes, dotted-glow-background, flickering-grid, grid-pattern, lamp, light-rays, meteors, noise-background, particles, retro-grid, ripple, shooting-stars, vortex, wavy-background, animated-gradient-text, flip-words, hyper-text, morphing-text, number-ticker, sparkles-text, text-highlighter, text-hover-effect, text-reveal, text-shimmer, typewriter, word-rotate, confetti, magnetic-button, moving-border, rainbow-button, ripple-button, shimmer-button, stateful-button, theme-toggler, animated-list, animated-tooltip, avatar-circles, bento-grid, card-hover-effect, card-stack, compare-slider, direction-aware-hover, dock, draggable-card, evervault-card, expandable-card, file-tree, focus-cards, glare-card, layout-grid, marquee, orbiting-circles, spotlight-card, tilt-card, wobble-card, animated-sidebar, animated-tabs, floating-navbar, navbar-menu, resizable-navbar, sticky-banner, file-drop, stepper, vanish-input, animated-modal, loaders, multi-step-loader, animated-testimonials, logo-cloud, tweet-card, container-scroll, hero-parallax, macbook-scroll, parallax-grid, scroll-progress, scroll-velocity, sticky-scroll, timeline, tracing-beam, animated-beam, blur-fade, border-beam, glowing-effect, 3d-card, 3d-pin, 3d-marquee, apple-cards-carousel, image-slider, following-pointer, lens, pointer-highlight, smooth-cursor, globe, world-map, browser-mockup, code-block, iphone-mockup, terminal, hero-aurora, hero-globe, hero-screenshot, hero-split-phone, hero-waves, hero-grid-minimal, features-bento, features-icon-grid, features-tabs, features-split-screenshot, features-steps, pricing-three-tiers, pricing-single-plan, pricing-comparison, testimonials-marquee, testimonials-featured, testimonials-grid, cta-vortex, cta-split-image, cta-newsletter, logos-marquee, logos-grid, faq-accordion, faq-two-column, navbar-floating, navbar-mega, footer-columns, footer-wordmark, footer-newsletter, auth-login-split, auth-signup-cardPreview
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.
@velora · aurora-background
npx shadcn@latest add https://velora.colorlib.com/r/aurora-background.jsonView source