---
name: "@viberdy"
slug: "viberdy"
description: "Animated React and Tailwind components in 14 design styles, from glassmorphism and aurora to kinetic type and dither, each with an AI prompt. 161 are free with source at github.com/viberdy-dev/ui; Pro items need an API key."
category: "Animated components"
tags: ["3d", "ai", "animation", "audio", "auth", "backgrounds", "blocks", "buttons", "cards", "cms", "dashboard", "developer-tools", "forms", "glassmorphism", "icons", "loaders", "marketing", "media", "navigation", "onboarding", "overlays", "pro-available", "retro", "tables", "text-effects", "theming"]
framework: "react"
license: null
author: "viberdy-dev"
website: "https://viberdy.dev"
github: "https://github.com/viberdy-dev/ui"
registry: "https://viberdy.dev/r/registry.json"
pro: true
pro_url: "https://viberdy.dev/pricing"
github_stars: 0
component_count: 250
generated_at: "2026-10-10T06:32:55.998Z"
---

# @viberdy

Animated React and Tailwind components in 14 design styles, from glassmorphism and aurora to kinetic type and dither, each with an AI prompt. 161 are free with source at github.com/viberdy-dev/ui; Pro items need an API key.

## Links

- Website: https://viberdy.dev
- GitHub: https://github.com/viberdy-dev/ui
- Registry JSON: https://viberdy.dev/r/registry.json
- Directory page: https://sh4dcn.vercel.app/registry/viberdy
- This file: https://sh4dcn.vercel.app/md/viberdy.md
- Pro / pricing: https://viberdy.dev/pricing

## Install

```sh
# add the whole registry (shadcn CLI)
npx shadcn@latest add https://viberdy.dev/r/registry.json
pnpm dlx shadcn@latest add https://viberdy.dev/r/registry.json
bunx shadcn@latest add https://viberdy.dev/r/registry.json
# clone the source repo
git clone https://github.com/viberdy-dev/ui.git
# fetch the raw registry index
curl -s https://viberdy.dev/r/registry.json
```

## Components (250)

| name | type | description | install |
| --- | --- | --- | --- |
| magnetic-button | registry:component | A button whose label leans toward the cursor with a springy pull. | `npx shadcn@latest add https://viberdy.dev/r/magnetic-button.json` |
| stacked-type-hero | registry:component | Oversized, tightly-stacked headline words that reveal in on mount — big type as sculpture. | `npx shadcn@latest add https://viberdy.dev/r/stacked-type-hero.json` |
| tilt-card | registry:component | A 3D card that tilts toward the cursor with spring physics. | `npx shadcn@latest add https://viberdy.dev/r/tilt-card.json` |
| marquee-ticker | registry:component | An infinite scrolling strip of words or logos that pauses when you hover it. | `npx shadcn@latest add https://viberdy.dev/r/marquee-ticker.json` |
| spotlight-grid | registry:component | A card grid with a soft red spotlight that follows the cursor across it. | `npx shadcn@latest add https://viberdy.dev/r/spotlight-grid.json` |
| grain-overlay | registry:component | A subtle animated film-grain texture layered over any section via canvas. | `npx shadcn@latest add https://viberdy.dev/r/grain-overlay.json` |
| scramble-text | registry:component | Text that decodes from random characters into its real word on hover. | `npx shadcn@latest add https://viberdy.dev/r/scramble-text.json` |
| swipe-card-stack | registry:component | A draggable deck of cards you flick away to cycle through, Tinder-style. | `npx shadcn@latest add https://viberdy.dev/r/swipe-card-stack.json` |
| odometer-counter | registry:component | A stat number that rolls up from zero to its target the moment it's in view. | `npx shadcn@latest add https://viberdy.dev/r/odometer-counter.json` |
| confetti-button | registry:component | A button that scatters a quick burst of confetti particles on click. | `npx shadcn@latest add https://viberdy.dev/r/confetti-button.json` |
| toast-stack | registry:component | A queue of toast notifications that stack, reflow, and auto-dismiss independently. | `npx shadcn@latest add https://viberdy.dev/r/toast-stack.json` |
| skeleton-shimmer | registry:component | Loading-state placeholder blocks with a light sweep animating across them. | `npx shadcn@latest add https://viberdy.dev/r/skeleton-shimmer.json` |
| progress-ring | registry:component | An SVG progress ring whose fill and centered percentage count up together on scroll into view. | `npx shadcn@latest add https://viberdy.dev/r/progress-ring.json` |
| range-slider | registry:component | A custom-styled slider with a drag handle and a value tooltip while dragging. | `npx shadcn@latest add https://viberdy.dev/r/range-slider.json` |
| flip-card | registry:component | A card that flips on a real Y-axis rotation to reveal a back face. | `npx shadcn@latest add https://viberdy.dev/r/flip-card.json` |
| typewriter-text | registry:component | Text that types itself out character by character, then cycles to the next phrase. | `npx shadcn@latest add https://viberdy.dev/r/typewriter-text.json` |
| sticky-scroll-stack | registry:component | Cards that pin and stack on top of each other as you scroll past. | `npx shadcn@latest add https://viberdy.dev/r/sticky-scroll-stack.json` |
| magnetic-nav-dock | registry:component | A macOS-style dock where icons magnify based on real distance from the cursor. | `npx shadcn@latest add https://viberdy.dev/r/magnetic-nav-dock.json` |
| animated-checkbox | registry:component | A checkbox whose checkmark draws itself in as a real SVG path animation. | `npx shadcn@latest add https://viberdy.dev/r/animated-checkbox.json` |
| image-comparison-slider | registry:component | A draggable before/after divider that reveals one image over another. | `npx shadcn@latest add https://viberdy.dev/r/image-comparison-slider.json` |
| ripple-click-effect | registry:component | A Material-style ripple that expands from the exact click point. | `npx shadcn@latest add https://viberdy.dev/r/ripple-click-effect.json` |
| floating-label-input | registry:component | A text input whose label floats from placeholder position into a caption on focus. | `npx shadcn@latest add https://viberdy.dev/r/floating-label-input.json` |
| animated-tabs-indicator | registry:component | A tab row where the active-state highlight slides between tabs instead of popping. | `npx shadcn@latest add https://viberdy.dev/r/animated-tabs-indicator.json` |
| gradient-border-beam | registry:component | A light beam that continuously travels around a card's border. | `npx shadcn@latest add https://viberdy.dev/r/gradient-border-beam.json` |
| morphing-hamburger-icon | registry:component | A three-line menu icon that morphs smoothly into an X. | `npx shadcn@latest add https://viberdy.dev/r/morphing-hamburger-icon.json` |
| glitch-text-hover | registry:component | An RGB-split, jittery glitch effect on text when you hover it. | `npx shadcn@latest add https://viberdy.dev/r/glitch-text-hover.json` |
| liquid-blob-cursor | registry:component | A soft blurred blob that trails the cursor with spring-smoothed lag. | `npx shadcn@latest add https://viberdy.dev/r/liquid-blob-cursor.json` |
| expandable-search-bar | registry:component | A search icon that smoothly expands into a full text input on click. | `npx shadcn@latest add https://viberdy.dev/r/expandable-search-bar.json` |
| card-carousel-3d | registry:component | Cards mounted on a rotating 3D ring — the active one faces forward, others recede. | `npx shadcn@latest add https://viberdy.dev/r/card-carousel-3d.json` |
| draggable-sortable-list | registry:component | A drag-handle-driven list that reorders with a smooth layout swap. | `npx shadcn@latest add https://viberdy.dev/r/draggable-sortable-list.json` |
| star-rating-interactive | registry:component | A 5-star rating control with hover preview and a springy fill pop. | `npx shadcn@latest add https://viberdy.dev/r/star-rating-interactive.json` |
| rotating-word-swap | registry:component | A headline where one word auto-cycles with a vertical odometer-style swap. | `npx shadcn@latest add https://viberdy.dev/r/rotating-word-swap.json` |
| draggable-bottom-sheet | registry:component | A modal sheet you can drag down to dismiss, with a distance + velocity threshold. | `npx shadcn@latest add https://viberdy.dev/r/draggable-bottom-sheet.json` |
| pricing-toggle-switch | registry:component | A monthly/yearly billing switch with the price sliding to its new value. | `npx shadcn@latest add https://viberdy.dev/r/pricing-toggle-switch.json` |
| command-palette | registry:component | A Cmd+K style searchable command menu with a filtered live list. | `npx shadcn@latest add https://viberdy.dev/r/command-palette.json` |
| file-upload-dropzone | registry:component | A real drag-and-drop file zone with a live dragover state and file chips. | `npx shadcn@latest add https://viberdy.dev/r/file-upload-dropzone.json` |
| segmented-control | registry:component | An iOS-style pill switch whose highlight slides between options. | `npx shadcn@latest add https://viberdy.dev/r/segmented-control.json` |
| vertical-timeline-reveal | registry:component | A scroll-triggered vertical timeline whose dots and cards reveal in sequence. | `npx shadcn@latest add https://viberdy.dev/r/vertical-timeline-reveal.json` |
| copy-code-snippet | registry:component | A dark code block with a one-click copy button that confirms itself. | `npx shadcn@latest add https://viberdy.dev/r/copy-code-snippet.json` |
| animated-stat-grid | registry:component | A row of stat counters that count up together the moment they scroll into view. | `npx shadcn@latest add https://viberdy.dev/r/animated-stat-grid.json` |
| audio-wave-visualizer | registry:component | A bouncing equalizer bar animation for audio/podcast/music UI. | `npx shadcn@latest add https://viberdy.dev/r/audio-wave-visualizer.json` |
| kanban-drag-columns | registry:component | A mini kanban board where cards drag both within and across columns. | `npx shadcn@latest add https://viberdy.dev/r/kanban-drag-columns.json` |
| testimonial-carousel | registry:component | An auto-advancing quote carousel with directional slide transitions. | `npx shadcn@latest add https://viberdy.dev/r/testimonial-carousel.json` |
| hide-on-scroll-navbar | registry:component | A navbar that slides away on scroll-down and reappears on scroll-up. | `npx shadcn@latest add https://viberdy.dev/r/hide-on-scroll-navbar.json` |
| theme-toggle-sun-moon-morph | registry:component | A track+thumb switch whose icon morphs between a sun and a crescent moon. | `npx shadcn@latest add https://viberdy.dev/r/theme-toggle-sun-moon-morph.json` |
| scroll-linked-image-mask-reveal | registry:component | An image whose circular clip-path mask grows and shrinks in lockstep with scroll. | `npx shadcn@latest add https://viberdy.dev/r/scroll-linked-image-mask-reveal.json` |
| searchable-faq-accordion | registry:component | A filterable FAQ list where each answer expands independently. | `npx shadcn@latest add https://viberdy.dev/r/searchable-faq-accordion.json` |
| masonry-image-hover-grid | registry:component | A CSS-columns masonry gallery with a scale + caption reveal on hover. | `npx shadcn@latest add https://viberdy.dev/r/masonry-image-hover-grid.json` |
| share-button-expand | registry:component | A share icon that expands into a row of social options with a copy-link state. | `npx shadcn@latest add https://viberdy.dev/r/share-button-expand.json` |
| page-loading-bar | registry:component | An nprogress-style top-of-page bar that eases toward completion, never stalling. | `npx shadcn@latest add https://viberdy.dev/r/page-loading-bar.json` |
| badge-ping-counter | registry:component | An icon badge counter that bounces and pings once on every increment. | `npx shadcn@latest add https://viberdy.dev/r/badge-ping-counter.json` |
| data-table-sortable | registry:component | A searchable table with three-state column sorting and a real loading skeleton. | `npx shadcn@latest add https://viberdy.dev/r/data-table-sortable.json` |
| date-range-picker | registry:component | A click-twice range calendar with a live hover preview and quick presets. | `npx shadcn@latest add https://viberdy.dev/r/date-range-picker.json` |
| file-tree-explorer | registry:component | A recursive, collapsible file tree with real roving-tabindex arrow-key navigation. | `npx shadcn@latest add https://viberdy.dev/r/file-tree-explorer.json` |
| inline-editable-grid | registry:component | A keyboard-driven spreadsheet grid with roving-cell navigation and Excel-style Enter/Tab commits. | `npx shadcn@latest add https://viberdy.dev/r/inline-editable-grid.json` |
| multi-select-combobox | registry:component | A chip-and-search combobox with full keyboard control and a selection cap. | `npx shadcn@latest add https://viberdy.dev/r/multi-select-combobox.json` |
| multi-step-form-flow | registry:component | A validated wizard with per-step gating, an editable review step, and a real success state. | `npx shadcn@latest add https://viberdy.dev/r/multi-step-form-flow.json` |
| nested-command-menu | registry:component | A Cmd+K menu with real submenu drilling, a breadcrumb trail, and scoped per-level search. | `npx shadcn@latest add https://viberdy.dev/r/nested-command-menu.json` |
| notification-center-panel | registry:component | A read/unread notification list with filtering, bulk actions, and a real empty state. | `npx shadcn@latest add https://viberdy.dev/r/notification-center-panel.json` |
| onboarding-checklist | registry:component | An expandable setup checklist with a real derived progress bar and a completion state. | `npx shadcn@latest add https://viberdy.dev/r/onboarding-checklist.json` |
| usage-pricing-calculator | registry:component | A live estimator with real marginal-tier overage pricing and an annual discount toggle. | `npx shadcn@latest add https://viberdy.dev/r/usage-pricing-calculator.json` |
| auth-screens-template | registry:component | Sign in, sign up and reset as one component — layout and mode switching only, with no submit logic. | `npx shadcn@latest add https://viberdy.dev/r/auth-screens-template.json` |
| blog-post-template | registry:component | A long-form article page with real reading progress and a ToC that tracks scroll. | `npx shadcn@latest add https://viberdy.dev/r/blog-post-template.json` |
| changelog-page-template | registry:component | A changelog with working tag filters and releases that expand in place. | `npx shadcn@latest add https://viberdy.dev/r/changelog-page-template.json` |
| dashboard-shell-template | registry:component | A dashboard shell with a collapsible rail and real routing between views. | `npx shadcn@latest add https://viberdy.dev/r/dashboard-shell-template.json` |
| docs-page-template | registry:component | A docs shell where the sidebar routes, search filters the tree and the ToC tracks the article. | `npx shadcn@latest add https://viberdy.dev/r/docs-page-template.json` |
| not-found-template | registry:component | A centered 404 with a huge numeral, a human message, a home CTA, and a subtle grid backdrop. | `npx shadcn@latest add https://viberdy.dev/r/not-found-template.json` |
| portfolio-page-template | registry:component | A personal portfolio with working discipline filters and a pointer-responsive work grid. | `npx shadcn@latest add https://viberdy.dev/r/portfolio-page-template.json` |
| pricing-page-template | registry:component | A pricing page that computes: seat slider, annual toggle and an expandable comparison matrix. | `npx shadcn@latest add https://viberdy.dev/r/pricing-page-template.json` |
| saas-landing-template | registry:component | A full marketing landing page: nav, hero, logo band, feature grid, and footer. | `npx shadcn@latest add https://viberdy.dev/r/saas-landing-template.json` |
| waitlist-page-template | registry:component | A single-purpose pre-launch page: headline, email capture form, and a joined-count signal. | `npx shadcn@latest add https://viberdy.dev/r/waitlist-page-template.json` |
| line-mask-reveal | registry:component | Reveals text one line at a time, each sliding up from behind its own clipping mask. | `npx shadcn@latest add https://viberdy.dev/r/line-mask-reveal.json` |
| morphing-shape-loop | registry:component | A decorative blob whose SVG outline continuously morphs between shapes. | `npx shadcn@latest add https://viberdy.dev/r/morphing-shape-loop.json` |
| page-transition-wrapper | registry:component | Wraps route content so it animates out and the next page animates in instead of swapping instantly. | `npx shadcn@latest add https://viberdy.dev/r/page-transition-wrapper.json` |
| scroll-velocity-skew | registry:component | Skews its content based on how fast the page is being scrolled, relaxing back to flat at rest. | `npx shadcn@latest add https://viberdy.dev/r/scroll-velocity-skew.json` |
| stagger-reveal-group | registry:component | A wrapper that reveals its children one after another as the group scrolls into view. | `npx shadcn@latest add https://viberdy.dev/r/stagger-reveal-group.json` |
| animated-dot-matrix | registry:component | A grid of dots that pulses outward in concentric ripples, drawn on canvas. | `npx shadcn@latest add https://viberdy.dev/r/animated-dot-matrix.json` |
| animated-mesh-waves | registry:component | Layered translucent wave ribbons scrolling at different speeds for a fluid mesh feel. | `npx shadcn@latest add https://viberdy.dev/r/animated-mesh-waves.json` |
| aurora-gradient-field | registry:component | Soft, hue-shifting color fields that drift behind a hero like ambient aurora light. | `npx shadcn@latest add https://viberdy.dev/r/aurora-gradient-field.json` |
| noise-gradient-canvas | registry:component | A slow-drifting colored noise wash rendered at low resolution and upscaled smooth. | `npx shadcn@latest add https://viberdy.dev/r/noise-gradient-canvas.json` |
| perspective-grid-floor | registry:component | A tilted, endlessly scrolling grid floor that recedes toward the horizon. | `npx shadcn@latest add https://viberdy.dev/r/perspective-grid-floor.json` |
| spotlight-follow-background | registry:component | A full-bleed radial glow that tracks the cursor with zero re-renders. | `npx shadcn@latest add https://viberdy.dev/r/spotlight-follow-background.json` |
| starfield-parallax | registry:component | A three-depth-layer field of drifting, twinkling stars with true parallax speed. | `npx shadcn@latest add https://viberdy.dev/r/starfield-parallax.json` |
| ticker-tape-background | registry:component | Oversized, near-invisible ticker rows scrolling behind the fold as ambient texture. | `npx shadcn@latest add https://viberdy.dev/r/ticker-tape-background.json` |
| announcement-badge-hero | registry:component | A large pulsing announcement pill anchors the hero above one headline. | `npx shadcn@latest add https://viberdy.dev/r/announcement-badge-hero.json` |
| bento-preview-hero | registry:component | Copy beside an asymmetric bento grid of small feature-glimpse tiles. | `npx shadcn@latest add https://viberdy.dev/r/bento-preview-hero.json` |
| logo-proof-hero | registry:component | A generous wordmark wall leads the hero, with a modest headline above it. | `npx shadcn@latest add https://viberdy.dev/r/logo-proof-hero.json` |
| product-shot-hero | registry:component | A dominant framed app-window screenshot mock with the headline as a caption above it. | `npx shadcn@latest add https://viberdy.dev/r/product-shot-hero.json` |
| split-screen-hero | registry:component | A copy-left, product-right split with a floating stacked dashboard card. | `npx shadcn@latest add https://viberdy.dev/r/split-screen-hero.json` |
| terminal-demo-hero | registry:component | A staged terminal window as the hero's centerpiece, typed command and streaming output. | `npx shadcn@latest add https://viberdy.dev/r/terminal-demo-hero.json` |
| video-backdrop-hero | registry:component | A cinematic full-bleed motion backdrop, built entirely from CSS and Framer Motion. | `npx shadcn@latest add https://viberdy.dev/r/video-backdrop-hero.json` |
| waitlist-capture-hero | registry:component | A waitlist hero that actually captures: validation, pending, success and queue position. | `npx shadcn@latest add https://viberdy.dev/r/waitlist-capture-hero.json` |
| cursor-crosshair-readout | registry:component | A drafting-tool crosshair with live X/Y coordinates that trails the pointer. | `npx shadcn@latest add https://viberdy.dev/r/cursor-crosshair-readout.json` |
| cursor-label-follower | registry:component | A contextual chip that trails the pointer and names whatever it is over. | `npx shadcn@latest add https://viberdy.dev/r/cursor-label-follower.json` |
| cursor-lens-magnifier | registry:component | A glass lens that follows the pointer and magnifies the live DOM beneath it. | `npx shadcn@latest add https://viberdy.dev/r/cursor-lens-magnifier.json` |
| cursor-snap-target | registry:component | A cursor dot that latches onto interactive elements and takes their exact shape. | `npx shadcn@latest add https://viberdy.dev/r/cursor-snap-target.json` |
| hover-slice-shear | registry:component | Display type cut into horizontal bands that fan apart under the pointer. | `npx shadcn@latest add https://viberdy.dev/r/hover-slice-shear.json` |
| hover-link-peek | registry:component | An index list that floats a velocity-tilted preview card beside the pointer. | `npx shadcn@latest add https://viberdy.dev/r/hover-link-peek.json` |
| hover-stroke-draw-button | registry:component | A button whose outline draws itself around the shape on hover, at any size. | `npx shadcn@latest add https://viberdy.dev/r/hover-stroke-draw-button.json` |
| hover-expand-panels | registry:component | A row of panels where the hovered one grows and its neighbours compress. | `npx shadcn@latest add https://viberdy.dev/r/hover-expand-panels.json` |
| beam-sweep-backdrop | registry:component | Slow conic light beams rotating behind content, CSS-only and compositor-friendly. | `npx shadcn@latest add https://viberdy.dev/r/beam-sweep-backdrop.json` |
| pointer-warp-dot-field | registry:component | A canvas dot grid that bulges and brightens away from the cursor. | `npx shadcn@latest add https://viberdy.dev/r/pointer-warp-dot-field.json` |
| crt-scanline-overlay | registry:component | Scanlines, aperture grille, rolling refresh and vignette over any content. | `npx shadcn@latest add https://viberdy.dev/r/crt-scanline-overlay.json` |
| split-flap-board | registry:component | A real Solari departure board — four layers and a hinge, with reels that land apart because they travel different distances. | `npx shadcn@latest add https://viberdy.dev/r/split-flap-board.json` |
| weight-wave-text | registry:component | Per-character variable font weight that swells around the pointer and drifts when idle. | `npx shadcn@latest add https://viberdy.dev/r/weight-wave-text.json` |
| extruded-type-tilt | registry:component | Display type with a solid extrusion that swings around as the pointer moves. | `npx shadcn@latest add https://viberdy.dev/r/extruded-type-tilt.json` |
| morphing-island-notch | registry:component | A status pill that resizes itself fluidly around whatever content it holds. | `npx shadcn@latest add https://viberdy.dev/r/morphing-island-notch.json` |
| pointer-parallax-scene | registry:component | A depth system where layers separate under the pointer from one shared motion source. | `npx shadcn@latest add https://viberdy.dev/r/pointer-parallax-scene.json` |
| flip-grid-reorder | registry:component | A filterable grid whose tiles travel to their new positions instead of snapping. | `npx shadcn@latest add https://viberdy.dev/r/flip-grid-reorder.json` |
| scroll-card-deal | registry:component | A pile of cards that fans out symmetrically as its section crosses the viewport. | `npx shadcn@latest add https://viberdy.dev/r/scroll-card-deal.json` |
| velocity-marquee-rail | registry:component | A marquee that accelerates with scroll speed and flips direction when you scroll back. | `npx shadcn@latest add https://viberdy.dev/r/velocity-marquee-rail.json` |
| path-follow-scroll | registry:component | A marker that rides an SVG curve on scroll, banking through the bends. | `npx shadcn@latest add https://viberdy.dev/r/path-follow-scroll.json` |
| drag-inertia-carousel | registry:component | A rail you can throw — it projects the momentum and settles on the nearest slide. | `npx shadcn@latest add https://viberdy.dev/r/drag-inertia-carousel.json` |
| fuzzy-match-input | registry:component | Subsequence search that scores by run length and word starts, and highlights the hits. | `npx shadcn@latest add https://viberdy.dev/r/fuzzy-match-input.json` |
| cursor-mask-reveal | registry:component | The pointer cuts a soft hole through one layer to expose a different one beneath. | `npx shadcn@latest add https://viberdy.dev/r/cursor-mask-reveal.json` |
| ascii-halftone-canvas | registry:component | Turns any canvas drawing into live ASCII art, sampled one pixel per glyph. | `npx shadcn@latest add https://viberdy.dev/r/ascii-halftone-canvas.json` |
| scrub-timeline-player | registry:component | A media scrubber with buffered range, hover timestamp and pointer-capture dragging. | `npx shadcn@latest add https://viberdy.dev/r/scrub-timeline-player.json` |
| liquid-metal-field | registry:component | Gooey metaball blobs that fuse and split as they drift, with a specular sheen. | `npx shadcn@latest add https://viberdy.dev/r/liquid-metal-field.json` |
| glare-tilt-card | registry:component | A card that tilts toward the pointer with a true angular specular sweep. | `npx shadcn@latest add https://viberdy.dev/r/glare-tilt-card.json` |
| chromatic-split-hover | registry:component | RGB channels of a headline separate toward the pointer and recombine to white. | `npx shadcn@latest add https://viberdy.dev/r/chromatic-split-hover.json` |
| magnetic-tile-grid | registry:component | A tile field that leans toward the pointer and brightens with proximity. | `npx shadcn@latest add https://viberdy.dev/r/magnetic-tile-grid.json` |
| particle-assemble-text | registry:component | Particles sampled from the glyphs themselves, assembling into a word and scattering on hover. | `npx shadcn@latest add https://viberdy.dev/r/particle-assemble-text.json` |
| specular-text-sweep | registry:component | A light band travelling inside the glyphs, clipped to the text so only ink lights up. | `npx shadcn@latest add https://viberdy.dev/r/specular-text-sweep.json` |
| orb-depth-field | registry:component | Floating orbs whose size, blur, opacity and speed all derive from one depth value. | `npx shadcn@latest add https://viberdy.dev/r/orb-depth-field.json` |
| orbital-action-menu | registry:component | A radial menu that fans actions along an arc, evenly spaced at any count. | `npx shadcn@latest add https://viberdy.dev/r/orbital-action-menu.json` |
| glass-refraction-panel | registry:component | A card of liquid glass: it bends its backdrop at the rim, with a graduated edge and a light that follows the pointer. | `npx shadcn@latest add https://viberdy.dev/r/glass-refraction-panel.json` |
| elastic-underline-nav | registry:component | A nav underline that stretches with the distance it travels and settles back to width. | `npx shadcn@latest add https://viberdy.dev/r/elastic-underline-nav.json` |
| progress-arc-gauge | registry:component | An SVG arc gauge with a needle and a readout that counts to its value. | `npx shadcn@latest add https://viberdy.dev/r/progress-arc-gauge.json` |
| notification-stack-peek | registry:component | Toasts collapsed into a depth-scaled deck that fans out on hover. | `npx shadcn@latest add https://viberdy.dev/r/notification-stack-peek.json` |
| wave-ribbon-band | registry:component | Layered SVG line-work flowing from two incommensurable sine waves. | `npx shadcn@latest add https://viberdy.dev/r/wave-ribbon-band.json` |
| flip-reveal-tiles | registry:component | A tile grid that flips on a diagonal wavefront to resolve into one image. | `npx shadcn@latest add https://viberdy.dev/r/flip-reveal-tiles.json` |
| segmented-morph-toggle | registry:component | A segmented control where only the selected option expands to its label. | `npx shadcn@latest add https://viberdy.dev/r/segmented-morph-toggle.json` |
| spotlight-list-focus | registry:component | A list that dims and blurs every row except the one under the pointer. | `npx shadcn@latest add https://viberdy.dev/r/spotlight-list-focus.json` |
| fractal-noise-drift | registry:component | GPU fractal noise drifting through a gradient light field, with no JS loop. | `npx shadcn@latest add https://viberdy.dev/r/fractal-noise-drift.json` |
| depth-card-carousel | registry:component | A carousel whose side cards recede in scale, blur and rotation from one offset value. | `npx shadcn@latest add https://viberdy.dev/r/depth-card-carousel.json` |
| text-mask-media-reveal | registry:component | Type used as a mask so imagery moves inside the letterforms. | `npx shadcn@latest add https://viberdy.dev/r/text-mask-media-reveal.json` |
| kinetic-stat-board | registry:component | Metrics, deltas and sparklines that all count in together from one shared loop. | `npx shadcn@latest add https://viberdy.dev/r/kinetic-stat-board.json` |
| pixel-dissolve-reveal | registry:component | A block-grid dissolve driven by a seeded shuffle, so it clears perfectly evenly. | `npx shadcn@latest add https://viberdy.dev/r/pixel-dissolve-reveal.json` |
| marquee-cylinder-3d | registry:component | Words on a rotating cylinder, with the radius derived from the face count. | `npx shadcn@latest add https://viberdy.dev/r/marquee-cylinder-3d.json` |
| avatar-orbit-cluster | registry:component | A team ring that redistributes at any size, lifting the hovered member out. | `npx shadcn@latest add https://viberdy.dev/r/avatar-orbit-cluster.json` |
| scroll-depth-layers | registry:component | A parallax scene where every layer derives from one shared scroll source. | `npx shadcn@latest add https://viberdy.dev/r/scroll-depth-layers.json` |
| infinite-drag-canvas | registry:component | An endlessly pannable board that recycles a fixed set of tiles via modulo wrapping. | `npx shadcn@latest add https://viberdy.dev/r/infinite-drag-canvas.json` |
| hover-reveal-text-gallery | registry:component | A list of text rows, each hiding a photograph that wipes open under the cursor and follows it. | `npx shadcn@latest add https://viberdy.dev/r/hover-reveal-text-gallery.json` |
| axis-supply-store-site | registry:component | A storefront drawn as an engineering document, with an inverted checkerboard lookbook. | `npx shadcn@latest add https://viberdy.dev/r/axis-supply-store-site.json` |
| seventeen-studio-site | registry:component | A print-spread studio site where photographs crop into a giant numeral and sit inline inside the sentence. | `npx shadcn@latest add https://viberdy.dev/r/seventeen-studio-site.json` |
| edge-sliver-poster-hero | registry:component | A saturated poster hero whose photographic sliver opens on hover, with live ticket tiers and a countdown. | `npx shadcn@latest add https://viberdy.dev/r/edge-sliver-poster-hero.json` |
| filmstrip-silhouette-hero | registry:component | A saturated field with a multiply-blended silhouette and a thumbnail strip that drives it. | `npx shadcn@latest add https://viberdy.dev/r/filmstrip-silhouette-hero.json` |
| moire-interference-field | registry:component | Two stripe layers a fraction of a degree apart, generating a shifting fringe field under the cursor. | `npx shadcn@latest add https://viberdy.dev/r/moire-interference-field.json` |
| whiplash-letters | registry:component | A headline whose letters follow the cursor as a spring chain — crisp at the head, loose at the tail. | `npx shadcn@latest add https://viberdy.dev/r/whiplash-letters.json` |
| hold-to-commit-button | registry:component | A destructive action that requires sustained pressure, with a ring that fills on an ease-in curve. | `npx shadcn@latest add https://viberdy.dev/r/hold-to-commit-button.json` |
| scrub-number-field | registry:component | A numeric input whose label you drag to scrub, with pointer lock and precision modifiers. | `npx shadcn@latest add https://viberdy.dev/r/scrub-number-field.json` |
| sparkline-scrub-cell | registry:component | An inline micro-chart you sweep to read exact values, with monotone interpolation that never invents a peak. | `npx shadcn@latest add https://viberdy.dev/r/sparkline-scrub-cell.json` |
| pendulum-menu | registry:component | Menu items that hang from a rail and swing on real pendulum physics, nudging their neighbours. | `npx shadcn@latest add https://viberdy.dev/r/pendulum-menu.json` |
| seeded-identity-mark | registry:component | Turns any string into a symmetric geometric logo that is byte-identical on every render, forever. | `npx shadcn@latest add https://viberdy.dev/r/seeded-identity-mark.json` |
| intent-safe-menu | registry:component | A mega-menu that reads where the pointer is heading, so cutting the corner never steals the submenu. | `npx shadcn@latest add https://viberdy.dev/r/intent-safe-menu.json` |
| topographic-contour-drift | registry:component | A survey map of terrain that never existed, traced live with marching squares and drifting underfoot. | `npx shadcn@latest add https://viberdy.dev/r/topographic-contour-drift.json` |
| displacement-smear-type | registry:component | A headline that smears along the pointer's direction of travel with a real accumulation blur. | `npx shadcn@latest add https://viberdy.dev/r/displacement-smear-type.json` |
| optimistic-inline-commit | registry:component | An instant-feedback control with the parts everyone skips: request sequencing and a rollback that restores the right value. | `npx shadcn@latest add https://viberdy.dev/r/optimistic-inline-commit.json` |
| caustic-light-pool | registry:component | Water caustics computed from the real focusing condition, so the bright filaments land where the physics puts them. | `npx shadcn@latest add https://viberdy.dev/r/caustic-light-pool.json` |
| native-sheet-dialog | registry:component | A sheet on the native dialog element — no hand-rolled focus trap, and the three things the platform leaves you fixed. | `npx shadcn@latest add https://viberdy.dev/r/native-sheet-dialog.json` |
| halftone-depth-field | registry:component | A rotated print screen that swells into a pool of light under the pointer, with the gamma actually done right. | `npx shadcn@latest add https://viberdy.dev/r/halftone-depth-field.json` |
| flow-field-drift | registry:component | Particles carried through a divergence-free curl-noise field, so the frame never drains into a few basins. | `npx shadcn@latest add https://viberdy.dev/r/flow-field-drift.json` |
| masked-scroll-highlight | registry:component | Copy that resolves word by word as you scroll, mapped by real reading position rather than word index. | `npx shadcn@latest add https://viberdy.dev/r/masked-scroll-highlight.json` |
| resizable-split-pane | registry:component | A split view with pointer capture, pixel minimums resolved against real width, and a separator you can actually tab to. | `npx shadcn@latest add https://viberdy.dev/r/resizable-split-pane.json` |
| form-error-summary | registry:component | The error pattern that actually works with a screen reader: focus the summary, link to the fields, punish late. | `npx shadcn@latest add https://viberdy.dev/r/form-error-summary.json` |
| undo-commit-toast | registry:component | An undo window that defers the action instead of reversing it, and pauses when you tab toward the button. | `npx shadcn@latest add https://viberdy.dev/r/undo-commit-toast.json` |
| infinite-list-sentinel | registry:component | Sentinel-based pagination with the stall fixed — the bug where a short page leaves the sentinel on screen and loading stops. | `npx shadcn@latest add https://viberdy.dev/r/infinite-list-sentinel.json` |
| type-specimen-hero | registry:component | A magazine-cover hero where the photograph inverts through the letterforms, pinned to its own stacking context. | `npx shadcn@latest add https://viberdy.dev/r/type-specimen-hero.json` |
| duotone-plate-hero | registry:component | A real two-colour separation via SVG filters — with the sRGB interpolation flag that everyone leaves out. | `npx shadcn@latest add https://viberdy.dev/r/duotone-plate-hero.json` |
| word-wheel-cylinder | registry:component | A rotating word wheel built on a real cylinder — derived radius, accumulated rotation, no backwards spin on the wrap. | `npx shadcn@latest add https://viberdy.dev/r/word-wheel-cylinder.json` |
| view-timeline-reveal | registry:component | Scroll reveals on a real CSS view timeline — off the main thread, and visible by default where it is not supported. | `npx shadcn@latest add https://viberdy.dev/r/view-timeline-reveal.json` |
| contrast-safe-swatch | registry:component | Picks a readable foreground from real relative luminance, and reports all three WCAG thresholds instead of one badge. | `npx shadcn@latest add https://viberdy.dev/r/contrast-safe-swatch.json` |
| spec-ledger-section | registry:component | A dense spec table with real header association, a focusable scroll region, and a sticky head that keeps its rule. | `npx shadcn@latest add https://viberdy.dev/r/spec-ledger-section.json` |
| sticky-index-section | registry:component | An editorial index with sticky year headers, and a switch that demonstrates the overflow ancestor that breaks them. | `npx shadcn@latest add https://viberdy.dev/r/sticky-index-section.json` |
| hanging-quote-section | registry:component | A pull quote with the opening mark optically aligned — measured from the real glyph, not a guessed em value. | `npx shadcn@latest add https://viberdy.dev/r/hanging-quote-section.json` |
| elastic-overscroll-list | registry:component | Rubber-band overscroll with the real asymptotic curve, engaged only at the boundary. | `npx shadcn@latest add https://viberdy.dev/r/elastic-overscroll-list.json` |
| lenticular-print-shift | registry:component | Two photographs interleaved in hard-edged strips that wipe between each other as the pointer crosses the plate. | `npx shadcn@latest add https://viberdy.dev/r/lenticular-print-shift.json` |
| reaction-diffusion-plate | registry:component | A live Gray-Scott solver as a background plate — coral, mitosis and maze are the same two equations at different feed and kill rates. | `npx shadcn@latest add https://viberdy.dev/r/reaction-diffusion-plate.json` |
| ordered-dither-plate | registry:component | A gradient quantised to a few tones by an 8x8 Bayer matrix — offset then quantised, dithered in linear light, one cell per device pixel. | `npx shadcn@latest add https://viberdy.dev/r/ordered-dither-plate.json` |
| pressure-signature-pad | registry:component | A signature pad with real variable-width ink — pen pressure where it exists, velocity everywhere else, coalesced samples and midpoint quadratics. | `npx shadcn@latest add https://viberdy.dev/r/pressure-signature-pad.json` |
| median-cut-palette-plate | registry:component | Pulls a genuinely distinct palette out of a photograph by median cut — splitting on channel spread, not on population, sorted by relative luminance. | `npx shadcn@latest add https://viberdy.dev/r/median-cut-palette-plate.json` |
| verlet-cloth-banner | registry:component | A banner hanging from its fixings as real Verlet cloth — previous-position integration, relaxation passes and a fixed timestep behind an accumulator. | `npx shadcn@latest add https://viberdy.dev/r/verlet-cloth-banner.json` |
| variable-blur-scrim | registry:component | A scrim whose blur ramps instead of switching on — stacked backdrop-filter layers at doubling radii with overlapping masks. | `npx shadcn@latest add https://viberdy.dev/r/variable-blur-scrim.json` |
| priority-plus-nav | registry:component | A nav that measures itself and collapses what does not fit into a More menu — ghost-row measurement, no breakpoints, no flicker loop. | `npx shadcn@latest add https://viberdy.dev/r/priority-plus-nav.json` |
| async-action-button | registry:component | A button that survives a real round trip — a minimum pending duration, a width that never twitches, aria-disabled instead of disabled. | `npx shadcn@latest add https://viberdy.dev/r/async-action-button.json` |
| iridescent-foil-sweep | registry:component | Hot-foil type that shifts colour under the pointer — Newton's series rather than a rainbow, translated rather than rotated. | `npx shadcn@latest add https://viberdy.dev/r/iridescent-foil-sweep.json` |
| otp-code-input | registry:component | A one-time-code field whose cells survive SMS autofill, paste and Android backspace. | `npx shadcn@latest add https://viberdy.dev/r/otp-code-input.json` |
| shortcut-recorder-field | registry:component | Records a keyboard chord by physical key position, and refuses the ones the browser owns. | `npx shadcn@latest add https://viberdy.dev/r/shortcut-recorder-field.json` |
| selection-annotate-toolbar | registry:component | A toolbar that follows a text selection and highlights ranges without touching the DOM. | `npx shadcn@latest add https://viberdy.dev/r/selection-annotate-toolbar.json` |
| concrete-wall-texture | registry:component | A seamless procedural concrete surface drawn once to canvas and blended over anything. | `npx shadcn@latest add https://viberdy.dev/r/concrete-wall-texture.json` |
| knockout-type-plate | registry:component | A headline that inverts the photograph beneath it, with a scrim that keeps it legible. | `npx shadcn@latest add https://viberdy.dev/r/knockout-type-plate.json` |
| live-hours-nav | registry:component | A small-business header that says whether the shop is open right now — computed in the shop's timezone, with overnight hours and split shifts handled. | `npx shadcn@latest add https://viberdy.dev/r/live-hours-nav.json` |
| entry-edge-fill-button | registry:component | A fill that wipes in from the edge your pointer crossed and leaves by the one you exit — the label inverts letter by letter as the edge passes through it. | `npx shadcn@latest add https://viberdy.dev/r/entry-edge-fill-button.json` |
| index-overlay-menu | registry:component | A full-screen menu set like a printed index — numbered entries in heavy type, and a treated photo plate that wipes in the direction you travel. | `npx shadcn@latest add https://viberdy.dev/r/index-overlay-menu.json` |
| ripple-roll-button | registry:component | A label that rolls letter by letter to a second copy, rippling outward from wherever your pointer came in — and settling back toward where it left. | `npx shadcn@latest add https://viberdy.dev/r/ripple-roll-button.json` |
| chapter-progress-nav | registry:component | A sticky section nav whose items fill like progress bars as you read — and still reaches the short last section that fixed-line navs never activate. | `npx shadcn@latest add https://viberdy.dev/r/chapter-progress-nav.json` |
| letterpress-light-type | registry:component | Type debossed into paper and lit by a real lighting model — the lamp follows your pointer, so every wall of every letter catches and loses the light. | `npx shadcn@latest add https://viberdy.dev/r/letterpress-light-type.json` |
| venetian-blind-slideshow | registry:component | A hero slideshow whose photographs change like venetian blinds turning — slats flip in a staggered cascade, with the dark frame showing through as they go edge… | `npx shadcn@latest add https://viberdy.dev/r/venetian-blind-slideshow.json` |
| ink-bleed-reveal | registry:component | A photograph that arrives the way ink wicks into paper — an organic front spreading from a point, with a wet tide-line of ink running just ahead of it. | `npx shadcn@latest add https://viberdy.dev/r/ink-bleed-reveal.json` |
| thumb-action-dock | registry:component | A phone bottom bar with Call, Directions and Book — that appears once the hero's CTA has gone, and steps aside for the footer, a focused field and the keyboard. | `npx shadcn@latest add https://viberdy.dev/r/thumb-action-dock.json` |
| neon-tube-sign | registry:component | A neon sign that lights the wall behind it — glass tubes with a hot core, one tired letter that stutters, an ignition flicker, and a real on/off switch. | `npx shadcn@latest add https://viberdy.dev/r/neon-tube-sign.json` |
| booking-slot-picker | registry:component | Pick a day, pick a time, confirm — with honest availability, a real keyboard grid, and a WhatsApp or email request mode for shops with no booking system. | `npx shadcn@latest add https://viberdy.dev/r/booking-slot-picker.json` |
| service-price-ledger | registry:component | A price list set like a printed menu — baseline dot leaders, tabular prices, a Book link per row — beside a photo plate that follows hover, focus, or on phones… | `npx shadcn@latest add https://viberdy.dev/r/service-price-ledger.json` |
| find-us-map-section | registry:component | A street map printed in the shop's colour, the address set large, a live "Open until 18:00" readout in the shop's own time, the week's hours, nearby stations a… | `npx shadcn@latest add https://viberdy.dev/r/find-us-map-section.json` |
| aperture-iris-reveal | registry:component | A photo revealed by a real iris — straight metal blades that part and twist from the centre — while a corner readout clicks down the f-stops from ƒ/22 to ƒ/1.4. | `npx shadcn@latest add https://viberdy.dev/r/aperture-iris-reveal.json` |
| rotating-seal-badge | registry:component | A round seal — the phrase fitted exactly around the circle with drawn dot separators — that turns once every 24 seconds, eases to a stop on hover, and is the l… | `npx shadcn@latest add https://viberdy.dev/r/rotating-seal-badge.json` |
| signal-field | registry:component | A machined dot grid lit by slow waves of light, with a pointer lens and click ripples. | `npx shadcn@latest add https://viberdy.dev/r/signal-field.json` |
| marker-highlight-text | registry:component | A felt-tip highlighter stroke with a ragged edge that draws itself behind a phrase when it scrolls into view. | `npx shadcn@latest add https://viberdy.dev/r/marker-highlight-text.json` |
| window-light-drift | registry:component | Afternoon sun through a window, crossing a plaster wall over ninety seconds — and your pointer casts a shadow in it. | `npx shadcn@latest add https://viberdy.dev/r/window-light-drift.json` |
| swatch-fan-deck | registry:component | A fan deck of paint chips that spreads in your hand on hover or focus — a real radio group, with arrow keys and the colour's name, not its hex. | `npx shadcn@latest add https://viberdy.dev/r/swatch-fan-deck.json` |
| hours-poster-section | registry:component | Opening hours set as a poster — days hanging off the edge, closed rows struck through, today banded in the one accent — with an open/closed line on the shop's … | `npx shadcn@latest add https://viberdy.dev/r/hours-poster-section.json` |
| headline-switch-hero | registry:component | The second line of the headline is the navigation: KITCHENS / BATHROOMS / LOFTS at headline size, and choosing one swaps the treated photo plate, the copy and … | `npx shadcn@latest add https://viberdy.dev/r/headline-switch-hero.json` |
| seam-reveal-hero | registry:component | A before-and-after hero with no handle: the seam is wherever your pointer is, eased like a curtain, and the colour arrives with the work. | `npx shadcn@latest add https://viberdy.dev/r/seam-reveal-hero.json` |
| class-timetable-section | registry:component | A week of classes set like a departure board — placed by real start time and length, one accent stripe behind today, filters that dim rather than delete, and a… | `npx shadcn@latest add https://viberdy.dev/r/class-timetable-section.json` |
| gift-voucher-composer | registry:component | Pick an amount, write a line, and the voucher is on the table as you type — a perforated bond-paper ticket with the amount cropped by its own edge and a serial… | `npx shadcn@latest add https://viberdy.dev/r/gift-voucher-composer.json` |
| colourway-product-card | registry:component | One photograph, every colourway: the shot is greyscaled and multiplied into the chosen colour, so a small label with six colours and one product photo gets six… | `npx shadcn@latest add https://viberdy.dev/r/colourway-product-card.json` |
| curtain-footer-section | registry:component | The page ends, lifts, and the footer is already there underneath: a sticky footer revealed by the last section sliding over it, with the wordmark cropped by th… | `npx shadcn@latest add https://viberdy.dev/r/curtain-footer-section.json` |
| ink-fluid-field | registry:component | A real Navier–Stokes fluid simulation on the GPU: your pointer drags luminous ink through dark water, and slow currents keep it alive when nobody is touching i… | `npx shadcn@latest add https://viberdy.dev/r/ink-fluid-field.json` |
| prism-beam-hero | registry:component | A raymarched glass prism on black: a white beam comes in from wherever your pointer is, a spectrum fans out the other side, and the prism turns once a minute. … | `npx shadcn@latest add https://viberdy.dev/r/prism-beam-hero.json` |
| lathe-story-scroll | registry:component | A five-chapter scroll story that turns a single drawn line into a three-dimensional object: revolved, glazed, exploded into named parts and reassembled, with n… | `npx shadcn@latest add https://viberdy.dev/r/lathe-story-scroll.json` |
| marbled-endpaper | registry:component | Paper marbling computed live on a canvas: two inks on unbleached paper, combed slowly into veins, with the pointer as the stylus and one accent drop the reader… | `npx shadcn@latest add https://viberdy.dev/r/marbled-endpaper.json` |
| final-call-section | registry:component | The closing spread of a trade site: an oversized two-tier ask cropped by the edge, a two-field enquiry line with one filled button, and a ledger of the four th… | `npx shadcn@latest add https://viberdy.dev/r/final-call-section.json` |
| liquid-glass-button | registry:component | A pill of liquid glass that bends what is behind it: real refraction at the rim, a rim and sheen lit by your pointer, and a gel-like press. | `npx shadcn@latest add https://viberdy.dev/r/liquid-glass-button.json` |
| liquid-glass-switch | registry:component | A toggle whose knob swells into a clear glass lens while you hold or drag it, magnifying the track beneath, then springs home solid. | `npx shadcn@latest add https://viberdy.dev/r/liquid-glass-switch.json` |
| liquid-glass-tab-bar | registry:component | A floating glass tab bar whose selection is a droplet: press and drag and it swells, stretches as it travels, magnifies the tabs beneath and lands on the neare… | `npx shadcn@latest add https://viberdy.dev/r/liquid-glass-tab-bar.json` |
| liquid-lens-hero | registry:component | A slab of liquid glass you drag across a vivid scene: the headline bends under its rim, colours split at the edge, and it wobbles like gel. Two WebGL passes, n… | `npx shadcn@latest add https://viberdy.dev/r/liquid-lens-hero.json` |
| glass-bento-wall | registry:component | A feature grid cut from one sheet of liquid glass: each tile is as thick as it is big, and one pointer light moves across every rim. | `npx shadcn@latest add https://viberdy.dev/r/glass-bento-wall.json` |
| liquid-wallpaper-field | registry:component | A slow WebGL wallpaper of folded silk layers on a seamless 60-second loop: vivid, calm, and sharp-edged enough for glass to bend. | `npx shadcn@latest add https://viberdy.dev/r/liquid-wallpaper-field.json` |
| glass-etch-text | registry:component | Real, selectable heading text rendered as glass: a lit bevel, a graduated rim and a hairline colour fringe, raised or etched in. | `npx shadcn@latest add https://viberdy.dev/r/glass-etch-text.json` |
| glass-focus-field | registry:component | A liquid-glass input whose rim notices the pointer before focus, thickens outward from where you click, ripples from the caret with every keystroke and clouds … | `npx shadcn@latest add https://viberdy.dev/r/glass-focus-field.json` |
| glass-pricing-tiers | registry:component | A pricing section where each plan is a thicker pane of glass than the last, and the plan you choose puts a lens over its price. | `npx shadcn@latest add https://viberdy.dev/r/glass-pricing-tiers.json` |
| glass-app-template | registry:component | A complete liquid-glass product page for a calendar app, where every glass surface shares one tint that adapts to the section under the nav as you scroll. | `npx shadcn@latest add https://viberdy.dev/r/glass-app-template.json` |
| glass-morph-popover | registry:component | A popover that grows out of its button as a drop of liquid glass, stretches toward its place and settles flat, then drains back the same way. | `npx shadcn@latest add https://viberdy.dev/r/glass-morph-popover.json` |
| glass-tint-footer | registry:component | A liquid-glass footer slab that rises over the section above as you scroll in, its meniscus edge sloshing on fast scrolls, with a pointer light, a droplet glid… | `npx shadcn@latest add https://viberdy.dev/r/glass-tint-footer.json` |
| hairline-tile-button | registry:component | A button that behaves like a live bento grid: on hover it re-tiles into compartments along lit hairline seams, compresses toward your press, and its keycaps ar… | `npx shadcn@latest add https://viberdy.dev/r/hairline-tile-button.json` |
| spec-numeral-tile | registry:component | A big bold numeral in a spec-sheet voice whose digits roll into place like an odometer, set in a hairline bento tile. | `npx shadcn@latest add https://viberdy.dev/r/spec-numeral-tile.json` |
| living-bento-grid | registry:component | A dark bento feature grid that is a live system: tiles update on their own, catch a pointer light, reorder by drag or keyboard, and grow into a detail panel. | `npx shadcn@latest add https://viberdy.dev/r/living-bento-grid.json` |
| keynote-bento-hero | registry:component | A launch hero set like a keynote recap slide: one huge figure in a 2x2 tile, and a bento grid that assembles around it as the numbers count up. | `npx shadcn@latest add https://viberdy.dev/r/keynote-bento-hero.json` |
| tile-expand-panel | registry:component | A primitive that grows any bento tile into a full panel: the panel opens from the tile's own rectangle while its cover, title and figure fly across to their ne… | `npx shadcn@latest add https://viberdy.dev/r/tile-expand-panel.json` |
| bento-pricing-tiles | registry:component | Pricing set as a bento grid: the recommended plan is the one 2x2 tile with the biggest price and the only accent, surrounded by plans, reassurances and a sales… | `npx shadcn@latest add https://viberdy.dev/r/bento-pricing-tiles.json` |
| bento-command-nav | registry:component | Site navigation as one row of bento tiles sharing 1px hairlines, with a pointer light that shows through them and menus that open as panels of tiles. | `npx shadcn@latest add https://viberdy.dev/r/bento-command-nav.json` |
| capture-loop-card | registry:component | A bento tile whose picture is a tightly cropped loop of your product, still until someone hovers or presses play, with a hairline that tracks the loop. | `npx shadcn@latest add https://viberdy.dev/r/capture-loop-card.json` |
| metric-proof-tiles | registry:component | A proof section set as bento tiles: 1x1 figures that count up once as they arrive, one accent tile that breaks the row, a quote, and a live figure that ticks s… | `npx shadcn@latest add https://viberdy.dev/r/metric-proof-tiles.json` |
| bento-footer-grid | registry:component | A bento footer whose tiles are live: a 90-day uptime strip you can read day by day, a back-to-top ring that fills as you scroll, a newsletter that widens acros… | `npx shadcn@latest add https://viberdy.dev/r/bento-footer-grid.json` |
| widget-reorder-input | registry:component | A "customise your dashboard" panel: drag or keyboard reorder, show and hide switches, a live miniature of the result, and save, cancel and reset. | `npx shadcn@latest add https://viberdy.dev/r/widget-reorder-input.json` |
| bento-launch-template | registry:component | A complete launch page from the Bento Box kit: keynote figures, product captures, proof, pricing and a footer set as tiles, broken once by a full-bleed race be… | `npx shadcn@latest add https://viberdy.dev/r/bento-launch-template.json` |
| slab-stack-hero | registry:component | A neo-brutalist first screen: a slab headline beside a pile of hard-shadow cards you can grab and throw. Thrown cards fly off and cut to the bottom; the rest s… | `npx shadcn@latest add https://viberdy.dev/r/slab-stack-hero.json` |
| card-shuffle-deck | registry:component | A reorderable neo-brutalist deck where cards lift onto their shadows, travel in straight lines and land exactly. Drag, shuffle or move with the keyboard; ranks… | `npx shadcn@latest add https://viberdy.dev/r/card-shuffle-deck.json` |
| pushed-shadow-button | registry:component | A neo-brutalist button on a hard 5px shadow: hover lifts it 2px, a press lands it exactly on its shadow. 3px ink everywhere, 100ms linear, no blur. | `npx shadcn@latest add https://viberdy.dev/r/pushed-shadow-button.json` |
| offset-shadow-card | registry:component | A neo-brutalist card on a hard shadow: it lifts 2px on hover and lands on the shadow when pressed. A flat drawn motif or a photo, a punched price tag, a sticke… | `npx shadcn@latest add https://viberdy.dev/r/offset-shadow-card.json` |

## For AI agents

```text
You are adding components from @viberdy to a shadcn-compatible project.
1. Read this file (https://sh4dcn.vercel.app/md/viberdy.md) for the component list.
2. Fetch the machine-readable index: https://viberdy.dev/r/registry.json
3. Install a single component with its install command from the table above.
4. Full structured record: https://sh4dcn.vercel.app/json (library slug: viberdy).
```