Flip Spinner

A small square loading spinner that flips over on one axis then the other, used as an inline loading indicator inside buttons, fields, toasts or panels while content loads. Ported to React from loadsv's Svelte Flip spinner by Pedro Lunet.

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

import Flip from "@/components/ui/flip";

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