COMPONENTS / FORM

Button

A semantic action with restrained, purposeful variants.

● Stablev0.1.0React
100%
ANATOMY
1Button2

A semantic action with restrained, purposeful variants.

3
  1. 1LabelNames the control or region.
  2. 2ContextExplains expected use.
  3. 3Interactive areaPreserves touch and focus.
INTERACTIVE STATES
USE WHEN

You need a familiar interface pattern with an opinionated editorial treatment.

AVOID WHEN

A native element already communicates the action clearly without extra structure.

ACCESSIBILITY

Keyboard-visible focus, semantic state, and reduced-motion behavior included.

INSTALLATION

Own the component source.

Manner is a shadcn-compatible source registry. The CLI resolves dependencies, writes the files into your app, and leaves every line under your control.

INSTALL pnpm dlx shadcn@latest add @manner/button · Base UI where behavior needs a primitive
terminalInstall with shadcn
pnpm dlx shadcn@latest registry add @manner=https://ui.myudak.com/r/{name}.jsonpnpm dlx shadcn@latest add @manner/button
PropsAvailable on the Button component.
classNamestring—

Additional styles for the root element.

disabledbooleanfalse

Prevents interaction and exposes disabled state.