Animated Button

A button with shimmer, spin, and glow animations using CSS keyframes and custom properties

animations button shimmer glow css-animation

"use client"

import { AnimatedButton } from "@/components/vritti/animated-button";

export function AnimatedButtonExample() {
  return (
    <div className="relative flex h-[200px] w-full items-center justify-center gap-4 overflow-hidden rounded-lg border">
      <AnimatedButton>Click Me</AnimatedButton>
      <AnimatedButton variant="glow" glow>Glow Effect</AnimatedButton>
    </div>
  );
}

Installation


pnpm dlx shadcn@latest add "https://vritti.thesatyajit.com/r/animated-button"

Dependencies


pnpm add @radix-ui/react-slot class-variance-authority