---
name: "@tween-ui"
slug: "tween-ui"
description: "GSAP & CSS animated React components and blocks. One file each, no shared runtime, reduced-motion handled."
category: "Animated components"
tags: ["animation", "audio", "auth", "blocks", "buttons", "cards", "cms", "icons", "loaders", "marketing", "media", "navigation", "overlays", "pro-available"]
framework: "react"
license: "MIT"
author: "StaticMania"
website: "https://tween-ui.vercel.app"
github: "https://github.com/StaticMania/tween-ui"
registry: "https://tween-ui.vercel.app/r/registry.json"
pro: true
pro_url: "https://tween-ui.vercel.app/block/pricing-plan-switch"
github_stars: 10
component_count: 104
generated_at: "2026-10-10T06:32:55.998Z"
---

# @tween-ui

GSAP & CSS animated React components and blocks. One file each, no shared runtime, reduced-motion handled.

## Links

- Website: https://tween-ui.vercel.app
- GitHub: https://github.com/StaticMania/tween-ui
- Registry JSON: https://tween-ui.vercel.app/r/registry.json
- Directory page: https://sh4dcn.vercel.app/registry/tween-ui
- This file: https://sh4dcn.vercel.app/md/tween-ui.md
- Pro / pricing: https://tween-ui.vercel.app/block/pricing-plan-switch

## Install

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

## Components (104)

| name | type | description | install |
| --- | --- | --- | --- |
| icon-trail-button | registry:ui | A pill button whose icon pill expands on hover or focus, playing out a staggered chevron trail before it parks. CSS transitions and a small state machine — no … | `npx shadcn@latest add https://tween-ui.vercel.app/r/icon-trail-button.json` |
| icon-trail-button-demo | registry:example | Usage examples for Icon Trail Button. | `npx shadcn@latest add https://tween-ui.vercel.app/r/icon-trail-button-demo.json` |
| sliding-tabs | registry:ui | A pill nav whose lime indicator scales in under the first tab, then slides to follow the pointer or keyboard focus. Leaving the nav returns it to the active ta… | `npx shadcn@latest add https://tween-ui.vercel.app/r/sliding-tabs.json` |
| sliding-tabs-demo | registry:example | Usage examples for Sliding Tabs. | `npx shadcn@latest add https://tween-ui.vercel.app/r/sliding-tabs-demo.json` |
| avatar-reveal | registry:ui | Three stacked avatars that scale and unblur in from the left on an elastic ease, then a caption slides in from the right. | `npx shadcn@latest add https://tween-ui.vercel.app/r/avatar-reveal.json` |
| avatar-reveal-demo | registry:example | Usage examples for Avatar Reveal. | `npx shadcn@latest add https://tween-ui.vercel.app/r/avatar-reveal-demo.json` |
| auth-modal | registry:ui | A login modal: the backdrop fades, the panel scales up, then the close button, title, sign-in providers and email field stagger in. Closing plays the sequence … | `npx shadcn@latest add https://tween-ui.vercel.app/r/auth-modal.json` |
| auth-modal-demo | registry:example | Usage examples for Auth Modal. | `npx shadcn@latest add https://tween-ui.vercel.app/r/auth-modal-demo.json` |
| number-counter | registry:ui | An animated stats counter whose digits spin up once when the stat scrolls into view. ScrollTrigger fires it, Number Flow handles the count. | `npx shadcn@latest add https://tween-ui.vercel.app/r/number-counter.json` |
| number-counter-demo | registry:example | Usage examples for Number Counter. | `npx shadcn@latest add https://tween-ui.vercel.app/r/number-counter-demo.json` |
| voice-sample-player | registry:ui | An audio player pill: press play and the name slides away, a lime waveform equalizer slides in and starts oscillating, and the icon morphs to pause. Pass a src… | `npx shadcn@latest add https://tween-ui.vercel.app/r/voice-sample-player.json` |
| voice-sample-player-demo | registry:example | Usage examples for Voice Sample Player. | `npx shadcn@latest add https://tween-ui.vercel.app/r/voice-sample-player-demo.json` |
| flip-card | registry:ui | A card that flips in 3D on hover or tap — the front rotates out while the back rotates in with its description, feature list and CTA staggering into place. | `npx shadcn@latest add https://tween-ui.vercel.app/r/flip-card.json` |
| flip-card-demo | registry:example | Usage examples for Flip Card. | `npx shadcn@latest add https://tween-ui.vercel.app/r/flip-card-demo.json` |
| faq-accordion | registry:ui | A single-open accordion that animates its height open while the answer reveals line by line through a SplitText mask and the icon morphs from plus to minus. | `npx shadcn@latest add https://tween-ui.vercel.app/r/faq-accordion.json` |
| faq-accordion-demo | registry:example | Usage examples for FAQ Accordion. | `npx shadcn@latest add https://tween-ui.vercel.app/r/faq-accordion-demo.json` |
| shiny-button | registry:ui | A pill button with a diagonal light sweep that glides across on hover while the leading sparkle twinkles. Pure CSS — no GSAP dependency. | `npx shadcn@latest add https://tween-ui.vercel.app/r/shiny-button.json` |
| shiny-button-demo | registry:example | Usage examples for Shiny Button. | `npx shadcn@latest add https://tween-ui.vercel.app/r/shiny-button-demo.json` |
| text-roll-button | registry:ui | A pill button whose label rolls up character by character on hover — the current text lifts out the top as a fresh copy rolls in from below, on a fine per-char… | `npx shadcn@latest add https://tween-ui.vercel.app/r/text-roll-button.json` |
| text-roll-button-demo | registry:example | Usage examples for Text Roll Button. | `npx shadcn@latest add https://tween-ui.vercel.app/r/text-roll-button-demo.json` |
| slide-arrow-button | registry:ui | A pill button whose label rolls up on hover while the chevron slides out of its lime badge and a fresh one slides in from the left. Pure CSS — no GSAP dependen… | `npx shadcn@latest add https://tween-ui.vercel.app/r/slide-arrow-button.json` |
| slide-arrow-button-demo | registry:example | Usage examples for Slide Arrow Button. | `npx shadcn@latest add https://tween-ui.vercel.app/r/slide-arrow-button-demo.json` |
| glow-button | registry:ui | A pill button floating over a soft red, amber, violet and cyan glow that sharpens as the button lifts and a chevron slides through its slot. Pure CSS — no GSAP… | `npx shadcn@latest add https://tween-ui.vercel.app/r/glow-button.json` |
| glow-button-demo | registry:example | Usage examples for Glow Button. | `npx shadcn@latest add https://tween-ui.vercel.app/r/glow-button-demo.json` |
| magnetic-button | registry:ui | A pill button pulled toward the cursor once it comes near, its label drifting a little further for parallax depth, then easing back to rest when the cursor lea… | `npx shadcn@latest add https://tween-ui.vercel.app/r/magnetic-button.json` |
| magnetic-button-demo | registry:example | Usage examples for Magnetic Button. | `npx shadcn@latest add https://tween-ui.vercel.app/r/magnetic-button-demo.json` |
| dot-bloom-button | registry:ui | A button whose leading dot blooms into a fill that floods the whole surface on hover, while the label rolls up to a fresh copy and flips to the contrasting col… | `npx shadcn@latest add https://tween-ui.vercel.app/r/dot-bloom-button.json` |
| dot-bloom-button-demo | registry:example | Usage examples for Dot Bloom Button. | `npx shadcn@latest add https://tween-ui.vercel.app/r/dot-bloom-button-demo.json` |
| arrow-tile-button | registry:ui | A label slab paired with a detached arrow tile: the tilt variant has the tile knock the slab so its letters topple in a wave away from it and spring upright, a… | `npx shadcn@latest add https://tween-ui.vercel.app/r/arrow-tile-button.json` |
| arrow-tile-button-demo | registry:example | Usage examples for Arrow Tile Button. | `npx shadcn@latest add https://tween-ui.vercel.app/r/arrow-tile-button-demo.json` |
| focus-frame-button | registry:ui | A framed button that locks on like a viewfinder on hover: the hairline folds into its corners, the brackets snap shut while the label rolls up and a fresh retu… | `npx shadcn@latest add https://tween-ui.vercel.app/r/focus-frame-button.json` |
| focus-frame-button-demo | registry:example | Usage examples for Focus Frame Button. | `npx shadcn@latest add https://tween-ui.vercel.app/r/focus-frame-button-demo.json` |
| slant-morph-button | registry:ui | A slanted label and arrow tile whose diagonal seam smoothly flips its lean like a hinge on hover with GSAP MorphSVG, while the colors trade places and a fresh … | `npx shadcn@latest add https://tween-ui.vercel.app/r/slant-morph-button.json` |
| slant-morph-button-demo | registry:example | Usage examples for Slant Morph Button. | `npx shadcn@latest add https://tween-ui.vercel.app/r/slant-morph-button-demo.json` |
| logo-orbit | registry:ui | Logos spaced evenly around a ring that rotates continuously, each mark counter-rotated so it always stays upright. Hover pauses the orbit. | `npx shadcn@latest add https://tween-ui.vercel.app/r/logo-orbit.json` |
| logo-orbit-demo | registry:example | Usage examples for Logo Orbit. | `npx shadcn@latest add https://tween-ui.vercel.app/r/logo-orbit-demo.json` |
| logo-cycle | registry:ui | A logo row that holds a fixed count and cycles the extras: the current set staggers up and blurs out as the next slides in from below. Hover pauses the loop. | `npx shadcn@latest add https://tween-ui.vercel.app/r/logo-cycle.json` |
| logo-cycle-demo | registry:example | Usage examples for Logo Cycle. | `npx shadcn@latest add https://tween-ui.vercel.app/r/logo-cycle-demo.json` |
| logo-wave | registry:ui | An endless logo strip where the mark nearest the midpoint rises and scales up while its neighbors step down into a wave. Hover pauses the marquee. | `npx shadcn@latest add https://tween-ui.vercel.app/r/logo-wave.json` |
| logo-wave-demo | registry:example | Usage examples for Logo Wave. | `npx shadcn@latest add https://tween-ui.vercel.app/r/logo-wave-demo.json` |
| image-fan-slider | registry:ui | An image gallery slider: a fan of photos that auto-advances — the active one large and sharp, its neighbors rotated and blurred on each side. Hover pauses. Pur… | `npx shadcn@latest add https://tween-ui.vercel.app/r/image-fan-slider.json` |
| image-fan-slider-demo | registry:example | Usage examples for Image Fan Slider. | `npx shadcn@latest add https://tween-ui.vercel.app/r/image-fan-slider-demo.json` |
| morphing-text | registry:ui | A headline text animation whose last word cycles through a list with a gooey blur morph — an SVG alpha threshold fuses the outgoing and incoming words into one… | `npx shadcn@latest add https://tween-ui.vercel.app/r/morphing-text.json` |
| morphing-text-demo | registry:example | Usage examples for Morphing Text. | `npx shadcn@latest add https://tween-ui.vercel.app/r/morphing-text-demo.json` |
| wordmark-reveal | registry:ui | A display wordmark text reveal that assembles itself on the first scroll — every letter turns in on its own vertical axis, then a script line leans in along th… | `npx shadcn@latest add https://tween-ui.vercel.app/r/wordmark-reveal.json` |
| wordmark-reveal-demo | registry:example | Usage examples for Wordmark Reveal. | `npx shadcn@latest add https://tween-ui.vercel.app/r/wordmark-reveal-demo.json` |
| pricing-plan-switch | registry:block | A pricing section where picking a plan morphs the name badge, crossfades the description and spins the price with Number Flow, while the checklist lights up it… | `npx shadcn@latest add https://tween-ui.vercel.app/r/pricing-plan-switch.json` |
| pricing-plan-switch-demo | registry:example | Usage examples for Pricing Plan Switch. | `npx shadcn@latest add https://tween-ui.vercel.app/r/pricing-plan-switch-demo.json` |
| process-card-reveal | registry:block | Numbered steps on a timeline whose connector fills before the next card slides and blurs into place — image one way, copy the other. Hover pauses the loop; cli… | `npx shadcn@latest add https://tween-ui.vercel.app/r/process-card-reveal.json` |
| process-card-reveal-demo | registry:example | Usage examples for Process Card Reveal. | `npx shadcn@latest add https://tween-ui.vercel.app/r/process-card-reveal-demo.json` |
| process-sticky-steps | registry:block | A process block whose heading, divider and step numbers stay sticky inside the section while the cards scroll past them. No GSAP — just Intersection Observer. | `npx shadcn@latest add https://tween-ui.vercel.app/r/process-sticky-steps.json` |
| process-sticky-steps-demo | registry:example | Usage examples for Process Sticky Steps. | `npx shadcn@latest add https://tween-ui.vercel.app/r/process-sticky-steps-demo.json` |
| strip-wipe | registry:block | A split testimonial slider whose photo wipes in as tiled strips beside the quote, the index ticking over on Number Flow. Prev and next reverse the wipe directi… | `npx shadcn@latest add https://tween-ui.vercel.app/r/strip-wipe.json` |
| strip-wipe-demo | registry:example | Usage examples for Strip Wipe. | `npx shadcn@latest add https://tween-ui.vercel.app/r/strip-wipe-demo.json` |
| rating-carousel | registry:block | A Swiper testimonial row of rating cards: drag or swipe it, and off-window cards fade and blur as they leave. Autoplay pauses on hover, and dots jump to a card. | `npx shadcn@latest add https://tween-ui.vercel.app/r/rating-carousel.json` |
| rating-carousel-demo | registry:example | Usage examples for Rating Carousel. | `npx shadcn@latest add https://tween-ui.vercel.app/r/rating-carousel-demo.json` |
| cta-image-fan | registry:block | A call-to-action with a fanned photo stack auto-advancing above the headline and a shiny button below. Built from Image Fan Slider and Shiny Button. | `npx shadcn@latest add https://tween-ui.vercel.app/r/cta-image-fan.json` |
| cta-image-fan-demo | registry:example | Usage examples for CTA Image Fan. | `npx shadcn@latest add https://tween-ui.vercel.app/r/cta-image-fan-demo.json` |
| cta-photo-headline | registry:block | A call-to-action where avatars pop in above a heading with two photos tucked into the copy — a pill that grows from the left, then a tilted square that drops i… | `npx shadcn@latest add https://tween-ui.vercel.app/r/cta-photo-headline.json` |
| cta-photo-headline-demo | registry:example | Usage examples for CTA Photo Headline. | `npx shadcn@latest add https://tween-ui.vercel.app/r/cta-photo-headline-demo.json` |
| blog-hover-expand | registry:block | A three-post blog row where the hovered card grows wider, its photo scales and tilts, and the title draws an underline. Pure CSS. | `npx shadcn@latest add https://tween-ui.vercel.app/r/blog-hover-expand.json` |
| blog-hover-expand-demo | registry:example | Usage examples for Blog Hover Expand. | `npx shadcn@latest add https://tween-ui.vercel.app/r/blog-hover-expand-demo.json` |
| integration-hub | registry:block | A hub-and-spoke integrations diagram: the center pops in, paths draw out to six logos, then a dot travels each line. Uses MotionPathPlugin. | `npx shadcn@latest add https://tween-ui.vercel.app/r/integration-hub.json` |
| integration-hub-demo | registry:example | Usage examples for Integration Hub. | `npx shadcn@latest add https://tween-ui.vercel.app/r/integration-hub-demo.json` |
| infinite-rotating-cards | registry:block | A hero wheel of photo cards set on a large circle so only the top arc shows, spinning slowly so the next idea always comes into view. | `npx shadcn@latest add https://tween-ui.vercel.app/r/infinite-rotating-cards.json` |
| infinite-rotating-cards-demo | registry:example | Usage examples for Infinite Rotating Cards. | `npx shadcn@latest add https://tween-ui.vercel.app/r/infinite-rotating-cards-demo.json` |
| card-hover-expand | registry:block | A card row where the hovered card grows wider, its photo fades in and the title drops to the bottom over a gradient. Every card stays expanded on small screens… | `npx shadcn@latest add https://tween-ui.vercel.app/r/card-hover-expand.json` |
| card-hover-expand-demo | registry:example | Usage examples for Card Hover Expand. | `npx shadcn@latest add https://tween-ui.vercel.app/r/card-hover-expand-demo.json` |
| card-spotlight-grid | registry:block | A staggered project grid — tile heights cycle every six cards — where the hovered tile tilts toward the cursor in 3D while its siblings scale back and dim. Poi… | `npx shadcn@latest add https://tween-ui.vercel.app/r/card-spotlight-grid.json` |
| card-spotlight-grid-demo | registry:example | Usage examples for Card Spotlight Grid. | `npx shadcn@latest add https://tween-ui.vercel.app/r/card-spotlight-grid-demo.json` |
| column-drift | registry:block | Three columns of review cards that swing in from the sides as the section scrolls, then drift past each other at different speeds. Cards lift on hover with an … | `npx shadcn@latest add https://tween-ui.vercel.app/r/column-drift.json` |
| column-drift-demo | registry:example | Usage examples for Column Drift. | `npx shadcn@latest add https://tween-ui.vercel.app/r/column-drift-demo.json` |
| team-scatter-focus | registry:block | A scattered team collage whose cards each fly in from their own direction, then blur and shrink back from whichever one you hover. Falls back to a stacked grid… | `npx shadcn@latest add https://tween-ui.vercel.app/r/team-scatter-focus.json` |
| team-scatter-focus-demo | registry:example | Usage examples for Team Scatter Focus. | `npx shadcn@latest add https://tween-ui.vercel.app/r/team-scatter-focus-demo.json` |
| tab-wipe | registry:block | A centered screenshot stage that wipes between slides on a clip-path edge while the incoming shot settles out of a slight scale and drift. The thumbnail strip … | `npx shadcn@latest add https://tween-ui.vercel.app/r/tab-wipe.json` |
| tab-wipe-demo | registry:example | Usage examples for Tab Wipe. | `npx shadcn@latest add https://tween-ui.vercel.app/r/tab-wipe-demo.json` |
| logo-wall-shuffle | registry:block | An integrations wall of staggered logo tiles where one mark at a time lifts away and the next rises in behind it. Every tile is visited before any repeats, and… | `npx shadcn@latest add https://tween-ui.vercel.app/r/logo-wall-shuffle.json` |
| logo-wall-shuffle-demo | registry:example | Usage examples for Logo Wall Shuffle. | `npx shadcn@latest add https://tween-ui.vercel.app/r/logo-wall-shuffle-demo.json` |
| testimonial-line-sweep | registry:block | A paged testimonial pair whose text sweeps out line by line behind masks while the portrait irises shut, then the next quote arrives the same way. Pages with b… | `npx shadcn@latest add https://tween-ui.vercel.app/r/testimonial-line-sweep.json` |
| testimonial-line-sweep-demo | registry:example | Usage examples for Testimonial Line Sweep. | `npx shadcn@latest add https://tween-ui.vercel.app/r/testimonial-line-sweep-demo.json` |
| cta-starfall | registry:block | A dark call-to-action section under a slow field of drifting stars lit by a violet bloom. The field is full on the first frame rather than spawning over time, … | `npx shadcn@latest add https://tween-ui.vercel.app/r/cta-starfall.json` |
| cta-starfall-demo | registry:example | Usage examples for CTA Starfall. | `npx shadcn@latest add https://tween-ui.vercel.app/r/cta-starfall-demo.json` |
| pricing-usage-slider | registry:block | A two-plan pricing section where the second card prices itself from a volume slider, the figure spinning with Number Flow as you drag while the track fills beh… | `npx shadcn@latest add https://tween-ui.vercel.app/r/pricing-usage-slider.json` |
| pricing-usage-slider-demo | registry:example | Usage examples for Pricing Usage Slider. | `npx shadcn@latest add https://tween-ui.vercel.app/r/pricing-usage-slider-demo.json` |
| grid-cascade | registry:block | A three-up testimonial grid that pages a whole set at a time — the current cards drop away on a stagger, then the next set cascades in from above, so the two n… | `npx shadcn@latest add https://tween-ui.vercel.app/r/grid-cascade.json` |
| grid-cascade-demo | registry:example | Usage examples for Grid Cascade. | `npx shadcn@latest add https://tween-ui.vercel.app/r/grid-cascade-demo.json` |
| cube-roll-item | registry:block | A numbered section index where each row is a 3D drum that rolls a quarter turn onto a filled face on hover. The roll follows the pointer — in from the top roll… | `npx shadcn@latest add https://tween-ui.vercel.app/r/cube-roll-item.json` |
| cube-roll-item-demo | registry:example | Usage examples for Cube Roll Item. | `npx shadcn@latest add https://tween-ui.vercel.app/r/cube-roll-item-demo.json` |
| shutter-slider | registry:block | An autoplaying feature slider. Each image opens through vertical slats that alternate from the top and bottom, the headline letters roll in like drum faces, co… | `npx shadcn@latest add https://tween-ui.vercel.app/r/shutter-slider.json` |
| shutter-slider-demo | registry:example | Usage examples for Shutter Slider. | `npx shadcn@latest add https://tween-ui.vercel.app/r/shutter-slider-demo.json` |
| testimonial-reel-focus | registry:block | A reel of testimonial cards wider than the window, run sideways by vertical page scroll from inside a sticky stage. Each card rises as it crosses in, so scroll… | `npx shadcn@latest add https://tween-ui.vercel.app/r/testimonial-reel-focus.json` |
| testimonial-reel-focus-demo | registry:example | Usage examples for Testimonial Reel Focus. | `npx shadcn@latest add https://tween-ui.vercel.app/r/testimonial-reel-focus-demo.json` |
| kinetic-type-ring | registry:block | A phrase wrapped once around a ring in real 3D. A falling dot pulls the letters out of a blur, then drag or scroll spins the ring. | `npx shadcn@latest add https://tween-ui.vercel.app/r/kinetic-type-ring.json` |
| kinetic-type-ring-demo | registry:example | Usage examples for Kinetic Type Ring. | `npx shadcn@latest add https://tween-ui.vercel.app/r/kinetic-type-ring-demo.json` |
| footer-wordmark-rise | registry:block | A dark site footer that rises into view over a glow swelling off the bottom edge, closed by a giant wordmark fitted to the column whose letters climb out of th… | `npx shadcn@latest add https://tween-ui.vercel.app/r/footer-wordmark-rise.json` |
| footer-wordmark-rise-demo | registry:example | Usage examples for Footer Wordmark Rise. | `npx shadcn@latest add https://tween-ui.vercel.app/r/footer-wordmark-rise-demo.json` |
| loader-line-fold | registry:block | A page preloader: the wordmark rises letter by letter while a hairline fills with a counter riding its tip. Once the page is ready the line travels to the midd… | `npx shadcn@latest add https://tween-ui.vercel.app/r/loader-line-fold.json` |
| loader-line-fold-demo | registry:example | Usage examples for Loader Line Fold. | `npx shadcn@latest add https://tween-ui.vercel.app/r/loader-line-fold-demo.json` |
| loader-iris-ring | registry:block | A page preloader built around a ring gauge: the arc fills in uneven steps while images flash through its lens and four corner counters sync and go live. Then a… | `npx shadcn@latest add https://tween-ui.vercel.app/r/loader-iris-ring.json` |
| loader-iris-ring-demo | registry:example | Usage examples for Loader Iris Ring. | `npx shadcn@latest add https://tween-ui.vercel.app/r/loader-iris-ring-demo.json` |
| testimonial-ring | registry:block | Testimonial cards stood on a 3D ring over a reflecting grid floor. Drag it and it spins with inertia before snapping to a card; scrolling turns it too. Whichev… | `npx shadcn@latest add https://tween-ui.vercel.app/r/testimonial-ring.json` |
| testimonial-ring-demo | registry:example | Usage examples for Testimonial Ring. | `npx shadcn@latest add https://tween-ui.vercel.app/r/testimonial-ring-demo.json` |
| gyro-gallery | registry:block | Gallery tiles riding three concentric, counter-rotating orbits on one tilted plane, like the rings of a gyroscope. The rig turns to face the pointer and calms … | `npx shadcn@latest add https://tween-ui.vercel.app/r/gyro-gallery.json` |
| gyro-gallery-demo | registry:example | Usage examples for Gyro Gallery. | `npx shadcn@latest add https://tween-ui.vercel.app/r/gyro-gallery-demo.json` |

## For AI agents

```text
You are adding components from @tween-ui to a shadcn-compatible project.
1. Read this file (https://sh4dcn.vercel.app/md/tween-ui.md) for the component list.
2. Fetch the machine-readable index: https://tween-ui.vercel.app/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: tween-ui).
```