Folder Preview Hover
Stacked folder rows in three color variants. Hovering lifts a folder, dims its siblings, and pops three photos out of the folder mouth with randomized tilt.
npx shadcn@latest add @compronents/folder-preview-hoverInstalls from ui.aryank.space. Needs a registry token and a one-time @compronents entry in components.json. The docs walk through both.
Checking access…
| Prop | Type | Default | Description |
|---|---|---|---|
| folders | { index: string; name: string; variant: 1 | 2 | 3; images: [string, string, string] }[] | 6 folders, 18 BLANK-hosted JPGs | Rows of two folders with per-folder preview photos. |
| background / textColor | string | "#f4f7f0" / "#0f0f0f" | Page background and folder label color. |
folderslinksFolder index, name, color variant, and three images.
navLeft / navRighttextThe header line above the folder stack.
gsap