Stepwise UI

Glow Button

A CTA button with a colour glow drifting along the inside of its bottom edge. The colour field sits inside the pill, never as an outside shadow, and its hues loop smoothly. Same two sizes and type scale as Button's own default/lg steps, with a very subtle edge. The fill follows the page's own theme (light surface in light mode, dark in dark mode) rather than staying fixed, and the drift freezes under prefers-reduced-motion.

Installation

npx stepwise-ui add glow-button

Default

import { GlowButton } from '@/components/stepwise/glow-button'

<GlowButton>Install on Figma</GlowButton>

Sizes

<GlowButton size="default">Default</GlowButton>
<GlowButton size="lg">Large</GlowButton>

Props

PropTypeDescription
size
"default" | "lg"
Matches Button's own default/lg sizing. Default: "default".
href
string
Renders an <a> instead of a <button>, styled identically - the right element for a CTA that navigates.
className
string
Merged onto the inner <button>.