A link that previews where it goes: the page's image, title and site, sliding along under the pointer and leaning as it moves.
We shot the series over a week, starting at the northern coast and ending in the outer island.
pnpm dlx shadcn@latest add @latheui/link-peekPart of Lathe Pro. Set up your project once with your license key: npx latheui init --key <key>. See Lathe Pro.
Link Peek is part of Lathe Pro
The preview is live and free to try. The source, the install and every assembly come with Pro: $79 once, with lifetime updates.
Depends on
Also accepts native anchor attributes.
| Prop | Type | Default | Description |
|---|---|---|---|
| href* (required) | string | — | Where the link goes. |
| preview* (required) | { title: string; image?: string; description?: string; site?: string; favicon?: string } | — | What the card shows. The site defaults to the link's domain. |
| follow | boolean | true | The card slides along the link to stay under the pointer. |
| tilt | number | 6 | Degrees the card leans with the pointer's speed. 0 keeps it level. |
| side | "top" | "bottom" | "top" | Which side of the link the card opens on. |
| width | number | 288 | Width of the card in px. |
| cardClassName | string | — | Extra classes for the card. |
<LinkPeek href={href} preview={preview} side="bottom" follow={false} tilt={0}>docs</LinkPeek>