Preview card tooltip
Hover a link to get a small card with icon, title, last update and status, without leaving the page.
Settings
Code
<button class="uv-tv">Preview<span><i>⌁</i><b>Project Atlas</b><small>Updated 2 min ago</small><em>In progress</em></span></button>Prompt for AI
Paste it into ChatGPT, Claude or Cursor and it will adapt the block to your project with these settings, even if you don’t use React.
More in Tooltips
Where to use it
Think of a task manager where projects are mentioned all over the place: in comments, in the activity feed, in a weekly summary. Instead of opening each one, people hover the name and see “Project Atlas · updated 2 min ago · In progress”. It is a hover card, the kind of rich tooltip GitHub or Notion use for mentions.
Keep it to three or four pieces of information; if it needs a scrollbar, it should be a page. In long lists, add a short delay before it opens, so moving the mouse down a column does not fire a card on every row.