Primitive

Button

Displays a button or a component that looks like a button. Supports multiple variants, sizes, and states.

Installation

npx benflux-ui add button

Usage

import { Button } from "@benflux-ui/react"

export default function Example() {
  return <Button>Click me</Button>
}

Sizes

With Icons

Loading State

Disabled

Props

PropTypeDefaultDescription
variant"default" | "outline" | "ghost" | "secondary" | "destructive" | "gradient" | "glow" | "glass" | "link""default"Visual style of the button
size"xs" | "sm" | "default" | "lg" | "xl" | "icon" | "icon-sm" | "icon-lg""default"Size of the button
loadingbooleanfalseShows a loading spinner and disables the button
leftIconReactNodeIcon rendered before the button text
rightIconReactNodeIcon rendered after the button text
asChildbooleanfalseMerges props onto child element (Radix Slot)
animatebooleantrueEnables tap animation via framer-motion