---
name: "@crafterui"
slug: "crafterui"
description: "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."
category: "Animated components"
tags: ["3d", "animation", "blocks", "cards", "glassmorphism", "media", "navigation", "overlays"]
framework: "react"
license: "MIT"
author: "SriSomanaath"
website: "https://crafterui.com"
github: "https://github.com/SriSomanaath/crafterui"
registry: "https://crafterui.com/r/registry.json"
pro: false
pro_url: null
github_stars: 2
component_count: 18
generated_at: "2026-09-21T01:50:16.753Z"
---

# @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.

## Links

- Website: https://crafterui.com
- GitHub: https://github.com/SriSomanaath/crafterui
- Registry JSON: https://crafterui.com/r/registry.json
- Directory page: https://sh4dcn.vercel.app/registry/crafterui
- This file: https://sh4dcn.vercel.app/md/crafterui.md

## Install

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

## Components (18)

| name | type | description | install |
| --- | --- | --- | --- |
| arrow-tooltip | registry: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 | registry: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 | registry: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 | registry: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 | registry: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 | registry: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 | registry: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 | registry: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 | registry: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 | registry: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 | registry: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 | registry: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 | registry: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 | registry: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 | registry: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 | registry: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 | registry: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 | registry: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` |

## For AI agents

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