Stripe Button

Smooth animated button crafted with refined glow and modern motion.

Installation

npx shadcn@latest add https://scrollxui.dev/registry/stripe-button.json

import { StripeButton } from "@/components/ui/stripe-button";

<StripeButton className="italic">
      Enter the Arena!
    </StripeButton>

Smooth animated button crafted with refined glow and modern motion.

Property	Type	Default	Description
`children`	React.ReactNode	`—`	Content displayed inside the button, typically text or icons.
`stripesSpeed`	number	`500`	Duration (in ms) for the diagonal stripe background shift on hover.
`variant`	"default" \| "compact"	`"default"`	Controls internal padding style. `compact` keeps height full with tighter layout.
`size`	"default" \| "sm" \| "lg" \| "icon"	`"default"`	Defines button height and padding. `icon` creates a square icon-only button.
`className`	string	`—`	Additional Tailwind or custom classes applied to the outer button wrapper.
`onClick`	() => void	`—`	Callback fired when the button is clicked.
`disabled`	boolean	`false`	Disables the button and prevents user interaction.