Text Underline Icon

An animated SVG icon depicting underlined text that draws its underline stroke on hover, used for text formatting toolbars and rich text editors.

Built with React and Tailwind. Copy the prompt and paste it into Claude Code, Cursor or Lovable: your agent adds Text Underline Icon to your project and fits it to your theme.

import TextUnderlineIcon from "@/components/ui/hu-text-underline";

export default function TextUnderlineIconDemo() {
  return (
    <div className="flex items-center justify-center w-full h-full min-h-[200px]">
      <TextUnderlineIcon size={48} />
    </div>
  );
}