Tornado Icon

An animated tornado icon whose lines compress and settle on hover or via an imperative handle, for toolbars and interactive UI accents.

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

import { TornadoIcon } from "@/components/ui/lu-tornado";

export default function TornadoIconDemo() {
  return (
    <div className="flex h-screen w-full items-center justify-center bg-background">
      <TornadoIcon size={64} className="text-foreground" />
    </div>
  );
}