Files

37 lines
762 B
TypeScript

"use client";
import { motion } from "motion/react";
import { cn } from "@/lib/utils";
interface AnimatedGradientTextProps {
children: React.ReactNode;
className?: string;
}
export function AnimatedGradientText({
children,
className,
}: AnimatedGradientTextProps) {
return (
<motion.span
className={cn(
"bg-gradient-to-r from-cyan-400 via-blue-500 to-blue-600 bg-clip-text text-transparent font-bold",
className,
)}
animate={{
backgroundPosition: ["0% 50%", "100% 50%", "0% 50%"],
}}
transition={{
duration: 4,
repeat: Infinity,
ease: "easeInOut",
}}
style={{
backgroundSize: "200% 200%",
}}
>
{children}
</motion.span>
);
}