Glowing Button

A visually distinct button component featuring a configurable, animated glow effect to highlight calls to action or important interactions.

Installation

npx shadcn@latest add https://badtz-ui.com/r/glowing-button.json

Install the following dependencies:

npm install clsx tailwind-merge

npx shadcn@latest add button

Add the `utils` file to the `@/lib` folder

import { ClassValue, clsx } from "clsx";
import { twMerge } from "tailwind-merge";
 
export function cn(...inputs: ClassValue[]) {
  return twMerge(clsx(inputs));
}

Copy and paste the following code into your project.

Component: glowing-button

Update the import paths to match your project setup.

Usage

import { GlowingButton } from "@/components/ui/buttons/glowing-button";

<GlowingButton>Hover me</GlowingButton>

Props

glowing-button props.

Type information not available