Star Border

A button component with an animated star border effect featuring a subtle animated gradient border that moves across the edges. It automatically adapts to light/dark themes with appropriate opacity levels. Features: • Theme-aware styling • Animated gradient borders • Polymorphic component support • Customizable animation speed • Configurable colors

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

import { cn } from "@/lib/utils"
import { StarBorder } from "@/components/ui/star-border"

export function StarBorderDemo() {
  return (
    <div className="space-y-8">
      <StarBorder>
        Theme-aware Border
      </StarBorder>
    </div>
  )
}