NK

Search

Search pages, posts, and components

All components

Shimmer Button

Buttons

A button with a light sweep that shimmers across on hover.

Installation

Add it with the shadcn CLI:

$pnpm dlx shadcn@latest add https://nawalkattel.com.np/r/shimmer-button.json
Or install manually
  1. 1. Install dependencies

    pnpm add clsx tailwind-merge
  2. 2. Copy the component source into components/library/shimmer-button.tsx

Props

PropTypeDefaultDescription
classNamestring - Classes applied to the button.

Accessibility

  • A real <button> with native focus and activation behaviour.
  • The sweep is decorative; the border change also signals hover.
  • No JavaScript animation - pure CSS transition.

Dependencies

clsxtailwind-merge