ActiveAnimated componentspro available16
@ns-ui
Animated components · MIT · data updated 2026-09-21
389 animated React components for Tailwind v4 and React 19, with a CLI and an MCP server.
aianimationaudiobackgroundsblocksbuttonscardschartsformsglassmorphismmediamobilenavigationonboardingoverlayspro-availabletables
Install
npx shadcn@latest add https://design.helpmarq.com/r/registry.jsonHealth
StatusActive
Last commit6 days ago
LicenseMIT
Open issues0
ArchivedNo
Stars16
Components (542)
accordion-latchadhesive-squeeze-beadairlift-slug-flowannouncement-bar-relayapproval-inline-diffautosave-ratchetauxin-canalavatar-stack-flockback-bearingbackground-ascii-causticsbackground-ascii-ditherbackground-ascii-domain-wallsbackground-ascii-flowbackground-ascii-force-chainsbackground-ascii-nodal-linesbackground-ascii-voronoi-wallsbackground-ascii-wakebackground-lloyd-relaxbackground-truchet-weavebadge-unread-tarnishbanner-tear-stubbarograph-drum-weekbias-hysteresisbitting-cutblast-hole-delay-sequenceboard-kanban-ascii-wipbobbin-lace-prickingbombe-drum-haltbowditch-closeboxplot-ascii-whiskerbrass-checkbraze-capillary-fillbreadcrumb-foldbreadcrumb-overflow-menubrine-floatbutton-cooldown-heatbutton-glassbutton-retry-backoffcaddisfly-case-assemblycambium-laycapstan-slipcarbon-ply-fadecard-dot-gain-screencard-number-embosscarousel-card-rifflecatenary-contact-staggercathode-stack-glowchain-scalechargen-rom-slicechart-bar-ditherchart-bar-halftonechart-donut-halftonechart-funnel-stage-dropchart-line-ditherchart-radar-ditherchart-ridgeline-terrainchart-scatter-ascii-binchart-waterfall-ascii-stepcheckbox-domino-runcheckbox-ink-stroke
Components: accordion-latch, adhesive-squeeze-bead, airlift-slug-flow, announcement-bar-relay, approval-inline-diff, autosave-ratchet, auxin-canal, avatar-stack-flock, back-bearing, background-ascii-caustics, background-ascii-dither, background-ascii-domain-walls, background-ascii-flow, background-ascii-force-chains, background-ascii-nodal-lines, background-ascii-voronoi-walls, background-ascii-wake, background-lloyd-relax, background-truchet-weave, badge-unread-tarnish, banner-tear-stub, barograph-drum-week, bias-hysteresis, bitting-cut, blast-hole-delay-sequence, board-kanban-ascii-wip, bobbin-lace-pricking, bombe-drum-halt, bowditch-close, boxplot-ascii-whisker, brass-check, braze-capillary-fill, breadcrumb-fold, breadcrumb-overflow-menu, brine-float, button-cooldown-heat, button-glass, button-retry-backoff, caddisfly-case-assembly, cambium-lay, capstan-slip, carbon-ply-fade, card-dot-gain-screen, card-number-emboss, carousel-card-riffle, catenary-contact-stagger, cathode-stack-glow, chain-scale, chargen-rom-slice, chart-bar-dither, chart-bar-halftone, chart-donut-halftone, chart-funnel-stage-drop, chart-line-dither, chart-radar-dither, chart-ridgeline-terrain, chart-scatter-ascii-bin, chart-waterfall-ascii-step, checkbox-domino-run, checkbox-ink-stroke, checkbox-tally-notch, citation-grounding-gap, citation-grounding-hatch, citation-inline-card, clock-card, cmm-probe-touch, cockle-swell, compare-crack-seam, compare-table-reach-rule, confidence-logprob-hatch, confirm-dial-align, confirm-hold-ink, confirm-slide-shatter, consent-scope-redact, contact-form-teletype, container-box-drawing, context-compaction-river, context-menu-unfold, context-prompt-shims, contra-strike, copy-button-travel, copy-field-crimp, countdown-vapor-digits, counter-carry-ripple, crack-arrest-hole, crack-polygon-order, craze-rule, creep-span, crimp-barrel-set, crossfoot-gap, cruet-settle, curd-cut-whey, cylinder-hillndale, damask-float, date-picker-moon, date-range-tape, decatron-step-ring, delta-frame-macroblock, device-mockup-ascii-screen, dew-coalesce, diagram-ascii-flow, dial-moire, dialog-emerge, diff-unified-viewer, divider-mosaic-split, divider-petscii-vu, divider-telephone-cord-delam, divider-teletext-mosaic, dock-cursor-magnify, dock-shelf-lean, drawer-counterweight, drill-down-spines, dropdown-drape, due-slip, edge-burnish-glaze, eink-waveform-ghost, empty-state-braille-orbit, empty-state-dashed, empty-state-mezzotint, empty-state-pegboard, empty-state-sonar, empty-state-survey, envelope-window, equation-kidney-cam, eval-regression-shear, expansion-gap-breather, extrusion-die-cut, facer-stamp-flip, faq-answer-depth-gutter, fax-line-slip, feature-grid-ascii-rule, feed-escapement, fiche-step-repeat, file-upload-seal, file-upload-thermal, filter-facet-mesh, flamegraph-ascii-frames, flash-entrain, float-ribbon-draw, floret-pack, flyball-throttle, flying-splice, footer-ascii-rule, frank-register, frazil-dam, fugitive-ink, fusee-cone, gallery-ascii-gradient-orientation, gallery-coverflow-caustic, galley-bracket, gantt-ascii-critical-path, gather-marver, gauge-capacity-waterline, git-graph-ascii-lanes, glaze-crawl-heal, glory-hole-cycle, gluten-windowpane, gravure-cell-wipe, grazing-light, grid-bento-ascii, grid-bento-dense, grid-magnetic-lattice, grinding-chatter-lobes, groove-pitch, growth-ring, guardrail-interlock-keys, hachure-fall, header-scroll-pill, heatmap-year-stipple, helicorder-line-wrap, hero-ascii-wordmark, hero-dipole-field, hero-long-exposure, hero-particles-webgl, histogram-live-grain, honeycomb-draw, honing-crosshatch, hover-card-dwell, idler-drop, image-crop-mat, index-contour, indicator-rack, input-focus-membrane, jacquard-card-chain, jam-kickout-loop, kelvin-wake, keymap-ascii-heat, knife-edge-rack-focus, knit-ladder-run, knot-capsize-cycle, lcd-response-smear, leaven-crest-fall, lens-ascii-magnify, lenticule-swing, lining-wear, listbox-sticky-groups, loader-ascii-diffuse-fill, loader-braille, loader-die-tumble, loader-ink-blob, loader-iris, loader-pendulum-sync, loader-spirograph-trace, loader-spring-bars, loader-thread-spool, log-viewer-ascii-tail, logo-cloud-settle, lug-cage-tally, manifold-bleed, map-choropleth-ascii, marquee-ticker-glyph, masonry-ascii-settle, melt-pond-drain, memory-ledger-decay, menu-nested-trays, mesh-lash, meter-context-window, meter-latency-capillary, meter-matrix-scan, meter-quota-meniscus, meter-quota-rule, meter-threshold-trip, millstone-furrow-flow, minimap-pantograph, mudflow-levee-build, mull-hinge, nav-blue-noise-scrim, nav-condense-rail, nav-overstrike-typewriter, nav-site-condense, neon-tube-striation, network-packet-trace, newsletter-cadence-rail, night-store, nomogram-edge, notification-bell-swing, optimistic-stitch, otp-reel, overflow-chip-mux, pagination-dog-ear, parison-inflate, passing-loop, password-strength-tide, patchbay-ascii-cable, pecked-ring, peen-coverage, picker-pareto-frontier, pin-register, pole-shy, polyp-bud, popover-pendulum, post-list-ascii-index, press-register, pricing-scale, profilometer-trace, progress-hatch, progress-narrated, progress-nlq-overstrike, progress-telegraph-log, progress-wick, prompt-version-grain, punch-figure, punch-patch, queue-triage-ratchet, quoin-lockup, rack-seat, radio-ballot-drop, radio-group-pin, raft-moor, range-light-transit, rating-stamp, redaction-hold-reveal, refresh-pull-flywheel, refusal-negotiation, remnant-cut, remontoire-rewind, reorder-drag-wake, retrieval-chunk-sieve, return-aviso, reveal-ripple-tiles, ring-stain, riso-drum-pass, roller-break-reduce, roller-occlusion, ropewalk-lay-twist, router-tier-cascade, routing-slip, running-belay, sankey-ascii-flow, schedule-ascii-freebusy, screen-flood-stroke, scroll-caliper, scroll-fine-register, scroll-particle-tunnel, scrubber-film-strip, seal-roll, seam-gild, search-winnow, seatmap-ascii-pick, seep-lattice, segmented-control-fling, select-caustic, serving-mallet-wind, shearer-advance, sheet-ascii-range, shortcuts-cheat-sheet, shutter-telegraph-board, signature-consent, sinkhole-ravel, skeleton-develop, skeleton-schema, slate-gauge, sleeper-renewal-relay, slider-allocation-wire, slider-loupe, slider-range-shear, slider-vernier, slug-field-mirror, slump-mould-drape, sorter-pocket-route, spall-face, sparkline-ascii, sparkline-automaton, specie-clip, spectrogram-ascii-bands, spindle-strike, split-flap-board, split-pane-weighted, starch-shear, stat-row-baseline-spark, stat-tile-ascii-arrive, stats-radar-sweep, status-glyph-cadence, status-metaball-merge, status-sphere-dots, steam-trap-batch-flush, stem-and-leaf-live, stencil-fill, stepper-needle, stepper-ratchet, storey-pole, streaming-ink-dry, streaming-markdown-caret, streaming-retraction, streaming-token-settle, strip-station, surface-glass, swipe-row-detent, switch-ascii-knife, switch-eclipse, switch-frost, switch-solder-bead, table-heat-shimmer, tabs-carriage, tabs-notch-tenon, tabs-rail-points, tabs-slack-cable, tacho-disc, tag-input-backspace, tag-input-cord, tag-input-pull, tag-input-tear, tally-cleave, tamper-tine-squeeze, team-grid-timezone-rail, tendril-cast, testimonial-wall-reflow, text-card-flick, text-decrypt, text-ekg-baseline, text-ligature-melt, text-slot-rotate, text-variable-weight, textarea-autosize-swell, ticker-tape-splice, ticker-teleprinter, time-ago-drift, time-picker-sundial, timeline-agent-lanes, timeline-changelog-wave, timeline-reasoning-rail, toast-gravity-stack, toast-undo-fuse, toc-minimap-mercury, toggle-theme-ascii, tonearm-skate, toner-fuse-streak, tool-call-board, tooltip-delay-group, tour-spotlight, transfer-list-siphon, tree-box-drawing, tree-hinge-fold, tree-root-trace, treemap-ascii-partition, truncation-taper-fade, truncation-word-count, tufting-gun-loop-pile, turbidite-graded-bed, turntable-stallPreview
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.
@ns-ui · accordion-latch
npx shadcn@latest add https://design.helpmarq.com/r/accordion-latch.jsonView source