Components
An animated inline link with a CSS-only underline that slides through on hover.
Loading preview...
import { TextUnderline } from "@/components/ui/text-underline";
export default function Default() {
return (
<div className="flex min-h-[320px] w-full items-center justify-center bg-background px-6 text-foreground">
<p className="text-2xl leading-relaxed text-foreground">
Shop the{" "}
<TextUnderline href="#" underlineColor="brand" underlineHeight="medium">
Performance Collection
</TextUnderline>{" "}
built for speed.
</p>
</div>
);
}