Volt UI Logo

Button

Displays a button or a component that looks like a button.

Usage

PreviewCode

Variants

Sizes

Example

Documentation GitHub

States & Icons (Slots)

API Reference

VoltButton — volt-button

InputTypeDefault
variant ButtonVariants['variant'] 'solid'
size ButtonVariants['size'] 'md'
type 'button' | 'submit' | 'reset' 'button'
disabled boolean false
class string ''
customClass string ''
aria-label string | null | undefined undefined
aria-labelledby string | null | undefined undefined
aria-describedby string | null | undefined undefined
aria-expanded string | null null
aria-pressed string | null null
aria-controls string | null | undefined undefined
aria-haspopup string | null null

VoltNativeButton — button[voltButton], a[voltButton]

InputTypeDefault
variant ButtonVariants['variant'] 'solid'
size ButtonVariants['size'] 'md'
disabled boolean false
class string ''

CVA variants

PropOptionsDefault
variant solid | destructive | outline | ghost | link solid
size sm | md | lg | icon md

Component Source

Install via CLI:npx @voltui/cli add button
TypeScript
Loading editor…

Copy this code to your project. The component uses ng-primitives and class-variance-authority.