HTML + CSSTooltips
Copy confirmation tooltip
Click the button and a green “Copied” bubble pops up while the check mark draws itself.
Settings
16px
1x
Code
<button class="uv-tconfirm">Copy link<span><svg viewBox="0 0 24 24"><path d="m5 12 4 4 10-10" pathLength="1"/></svg>Copied</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
Copying something gives no feedback on its own, so people click twice to be sure. This fixes that. Use it for the invite link of a shared trip planner, the referral code in a subscription app or the “Copy link” of a job posting. A copy-to-clipboard tooltip in HTML and CSS, with a check that draws in.
The bubble only shows the confirmation; the actual copying needs a line of JavaScript with the Clipboard API. Show it only once the copy has worked. It stays while the button has focus, and clicking elsewhere closes it.