Make your own badge!

import { Badge } from "@/components/ui/badge";
import { ExternalLink } from 'lucide-react';
import Link from "next/link";

export function DynamiteBadge() {
  return (
    <Link 
      href="https://www.dynamite-ai.com/tools/undefined"
      target="_blank"
      rel="noopener"
      className="inline-block transition-transform hover:scale-105 focus:outline-none focus:ring-2 focus:ring-purple-300 rounded-md"
    >
      <Badge 
        className="px-4 py-2 h-auto text-base bg-gradient-to-r from-white to-purple-50 text-purple-800 border border-purple-200 hover:from-purple-50 hover:to-purple-100 shadow-sm rounded-full"
      >
        <div className="flex items-center gap-2">
          <span className="font-semibold text-purple-900">Featured on</span>
          <span className="font-bold text-[#7e22ce]">Dynamite AI</span>
          <ExternalLink className="h-4 w-4 text-purple-600" />
        </div>
      </Badge>
    </Link>
  );
}