Spark Badge

An animated canvas credential badge that dissolves and reforms out of luminous rain and curl-noise embers, for hero sections and background decoration.

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

import { SparkBadge } from "@/components/ui/spark-badge";

export default function SparkBadgeDemo() {
  return (
    <div style={{ width: "100%", aspectRatio: "1 / 1" }}>
      <SparkBadge />
    </div>
  );
}