Heading 1 Icon

An animated heading-1 icon that plays a subtle bounce animation on hover or via an imperative handle, built for 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 Heading 1 Icon to your project and fits it to your theme.

import { Heading1Icon } from "@/components/ui/lu-heading-1";

export default function Heading1IconDemo() {
  return (
    <div className="flex items-center justify-center p-10">
      <Heading1Icon size={32} />
    </div>
  );
}