Back

Gradient Button

Satu Visual ComponentNew

A button whose gradient shifts across on hover.

Installation

Add it with the CLI:

Terminal

$

Or open the Code tab above and copy it in manually — it relies on the standard cn() helper from @/lib/utils.

Usage

The gradient slides via background-position on hover — no keyframes needed.

Props

PropTypeDefaultDescription
childrenReactNodeButton label / content.
classNamestringExtra classes.
...propsButtonHTMLAttributesAll native <button> props.