sh4dcnv2 · atlas
← libraries

@crafterui

Motion and interaction components for React and Tailwind. 3D carousels, scroll letter reveals, a Dynamic Island, cursor hit-testing and rolling countdowns, installed with the CLI and owned as source.

18 components react shadcn-cli MIT

Install this registry

shadcn (npm) npx shadcn@latest add https://crafterui.com/r/registry.json
pnpm pnpm dlx shadcn@latest add https://crafterui.com/r/registry.json
bun bunx shadcn@latest add https://crafterui.com/r/registry.json
fetch registry curl -s https://crafterui.com/r/registry.json

Components

18 total
Arrow Tooltip ui

A tooltip with a fully outlined border arrow that stays seamlessly connected to the panel on every side, built on Radix UI.

npx shadcn@latest add https://crafterui.com/r/arrow-tooltip.json
Dynamic Island ui

An Apple-style Dynamic Island that morphs between idle, ring, silent, and timer states with spring physics and blurred content cross-fades using Motion.

npx shadcn@latest add https://crafterui.com/r/dynamic-island.json
Countdown Timer ui

A full-screen countdown with fluid rolling digits, play/pause and reset controls, and auto-loop, built with NumberFlow and Motion.

npx shadcn@latest add https://crafterui.com/r/countdown-timer.json
Super Hover ui

Headless cursor hit-testing engine: tracks which element is under the pointer frame-by-frame, so hover keeps following the cursor even while the list scrolls b…

npx shadcn@latest add https://crafterui.com/r/super-hover.json
Super Hover List ui

A scrollable index whose active row — and its revealed artwork — keeps tracking the cursor while the list scrolls beneath it, unlike native hover, via frame-by…

npx shadcn@latest add https://crafterui.com/r/super-hover-list.json
Username Reel ui

A slot-machine handle picker that spins a vertical reel of names past a fixed prefix, highlighting the centered one, then decelerates and lands on a final user…

npx shadcn@latest add https://crafterui.com/r/username-reel.json
Handwritten Response ui

An AI answer written out in marker pen: Caveat handwriting, a highlighter swipe, a hand-drawn circle and a crossed-out correction, with each word inking in as …

npx shadcn@latest add https://crafterui.com/r/handwritten-response.json
Letter Reveal ui

Headline type that writes itself in on scroll, one letter at a time, with a synthesised tick as each lands. Letters take no space until they arrive, so a centr…

npx shadcn@latest add https://crafterui.com/r/letter-reveal.json
Hero Carousel ui

A full-bleed editorial hero driven by a filmstrip: cards share one top edge, the focused card unfurls to full height while its neighbours stay clipped to half,…

npx shadcn@latest add https://crafterui.com/r/hero-carousel.json
Works Wheel ui

A portfolio index that rests as a ring of cards around a title and, on the first notch of scroll, blows open into a vertical 3D drum you turn through - front c…

npx shadcn@latest add https://crafterui.com/r/works-wheel.json
Glass Lens Carousel ui

A looping image strip that is never drawn straight to screen: it renders to an offscreen texture, then a fullscreen pass samples it back through a thick optica…

npx shadcn@latest add https://crafterui.com/r/glass-lens-carousel.json
Dither Helix Carousel ui

A spiral column of cards, each mapped onto the surface of the cylinder it orbits so its outer edges retreat in depth. As cards travel away they pass through a …

npx shadcn@latest add https://crafterui.com/r/dither-helix-carousel.json
Molten Ring Carousel ui

A carousel with no mesh and no image elements: every card is a rounded-box distance field, and one fullscreen pass takes a smooth minimum across all of them. C…

npx shadcn@latest add https://crafterui.com/r/molten-ring-carousel.json
Corridor Carousel ui

A gallery you fly down instead of scroll through: four walls - left, right, ceiling and floor - papered with the same run of pictures, drifting out of the vani…

npx shadcn@latest add https://crafterui.com/r/corridor-carousel.json
Spine Accordion ui

A shelf of work you open one piece at a time. Closed, every project is a hairline spine with its name set bottom-to-top along the edge; hover, tap or focus one…

npx shadcn@latest add https://crafterui.com/r/spine-accordion.json
Mercury Surface ui

Headless gooey-surface engine: an SVG metaball filter whose border never swells, because every working blur carries its own solved pair of alpha thresholds, pl…

npx shadcn@latest add https://crafterui.com/r/mercury-surface.json
Mercury Dial ui

A speed dial that bursts into droplets. The trigger swells while the drops gather inside it, each one oozes out under surface tension and then fires past full …

npx shadcn@latest add https://crafterui.com/r/mercury-dial.json
Mercury Menu ui

A dropdown the button pours out of itself. The trigger swells, the panel oozes up under its own weight and then fires into place on a pop spring with the rows …

npx shadcn@latest add https://crafterui.com/r/mercury-menu.json