Skip to main content Skip to navigation Skip to search


Button Properties

Name Type Description
action "solid" | "outline" | "flat" | "flat-inline" Define the type of action the button triggers - `solid`: buttons direct the user’s attention to the primary action the application is suggesting that the user take. - `outline`: buttons indicate secondary actions that compliments a primary action or reduces visual noise when there are many actions on the page. - `flat`: buttons are used as tertiary buttons. Can also be used inline because they are different from content in style and recognizable as buttons alongside content.
status "primary" | "success" | "warning" | "danger" | "neutral" | "inverse" Sets the color of the button to match the following string statuses
size "sm" | "md" Sets the overall height and width of the button based on the following string values:
block boolean Sets if the button should be full width with display block
privateHost HTMLElement
loadingState default | loading | success | error
styles CSSResultGroup[]

Button CSS Properties


Button Slots

Name Description
Content slot for inside the button