ActiveAnimated components24
@fancy-ui
Animated components · MIT · data updated 2026-10-27
145 animated React components with motion, glow and sound effects, built with Tailwind CSS v4.

3daianimationaudiobackgroundsbuttonscardseditorformsglassmorphismiconsloadersmarketingmedianavigationoverlaysretrotables
Install
npx shadcn@latest add https://fancy-ui.rama.app/r/registry.jsonHealth
StatusActive
Last committoday
LicenseMIT
Open issues20
ArchivedNo
Stars24
Components (161)
accordionagent-planai-data-tablealert-dialoganimated-beamanimated-testimonialsanimated-tooltipapple-card-carouselapproval-cardartifact-cardautocompleteavatarbadgebento-gridbg-falling-starsbg-starsblur-revealbookborder-beambox-revealbreadcrumbbuttonbutton-groupcard-3dcard-spotlightchat-errorchat-messagechat-panelcheckboxcode-diffcollapsiblecolourful-textcomboboxcommand-menucomparecomposerconfetticontainer-scrollcontainer-text-flipcontext-menucontext-ringcopy-buttondatamosh-transitiondate-pickerdialogdim-siblingsdirection-aware-hoverdisplacement-textdockdrawerdropdown-menueditorial-enginefile-uploadfireworks-hdrflickering-gridflip-cardflip-wordsfluid-cursorfocusfollow-button
Components: accordion, agent-plan, ai-data-table, alert-dialog, animated-beam, animated-testimonials, animated-tooltip, apple-card-carousel, approval-card, artifact-card, autocomplete, avatar, badge, bento-grid, bg-falling-stars, bg-stars, blur-reveal, book, border-beam, box-reveal, breadcrumb, button, button-group, card-3d, card-spotlight, chat-error, chat-message, chat-panel, checkbox, code-diff, collapsible, colourful-text, combobox, command-menu, compare, composer, confetti, container-scroll, container-text-flip, context-menu, context-ring, copy-button, datamosh-transition, date-picker, dialog, dim-siblings, direction-aware-hover, displacement-text, dock, drawer, dropdown-menu, editorial-engine, file-upload, fireworks-hdr, flickering-grid, flip-card, flip-words, fluid-cursor, focus, follow-button, form-field, frosted-glass, glare-card, glow-border, glowing-effect, gradient-button, hover-card, hyper-text, icon-button, image-generation, image-trail-cursor, inline-citation, input, interactive-grid-pattern, interactive-hover-button, internals, internals-dom, internals-markdown, internals-motion, label, letter-pullup, line-hover-link, line-reveal, line-shadow-text, link, liquid-glass, liquid-text, logo-cloud, magnetic, magnetic-field, marquee, matrix-rain, meteors, mosaic-glow, navbar, navigation-menu, neon-border, noise-reveal, number-input, number-ticker, pagination, password-input, pixel-loader, pixel-scene, popover, presence, pressable, prompt-suggestions, pulse-beam, radio-group, rainbow-button, reasoning-panel, recommendation-card, reveal, ripple, ripple-button, scroll-anchor, scroll-progress, search-input, select, sheet, shimmer-button, sidebar, skeleton, slider, smooth-cursor, sound, sources, sparkles, sparkles-text, status-morph, stepper, sticky-scroll, story-thread, streaming-text, subagent-list, sun-switch, switch, tabs, terminal-block, terminal-text, text-generate-effect, text-reveal-card, text-roll, textarea, thinking-indicator, thread-list, tick-nav, time-picker, timeline, toast, toggle, toggle-group, tool-call, tool-timeline, tooltip, tracing-beam, typing-indicator, utils, voice-input, web-searchPreview
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.