Hovercard
Show a Popover with additional information when users hover over an element.
1234567891011121314151617181920212223242526272829303132
import * as Ariakit from "@ariakit/react";import "./style.css";export default function Example() {return (<div className="wrapper">href="https://x.com/ariakitjs"className="anchor">@ariakitjs<imgsrc="https://pbs.twimg.com/profile_images/1547936373243490306/dSn6Am0o_400x400.jpg"alt="Ariakit"className="avatar"/>Ariakit<p>Toolkit for building accessible web apps with React.</p><a href="https://x.com/ariakitjs" className="button primary flat">Follow</a></div>);}import * as Ariakit from "@ariakit/react";import "./style.css";export default function Example() {return (<div className="wrapper">href="https://x.com/ariakitjs"className="anchor">@ariakitjs<imgsrc="https://pbs.twimg.com/profile_images/1547936373243490306/dSn6Am0o_400x400.jpg"alt="Ariakit"className="avatar"/>Ariakit<p>Toolkit for building accessible web apps with React.</p><a href="https://x.com/ariakitjs" className="button primary flat">Follow</a></div>);}