Button

Triggers an action. Sixteen variants — solid, soft, outline, ghost and link — five sizes, and can render as a link.

Built on Radix UI
$ pnpm dlx shadcn@latest add https://multidash-app.vercel.app/r/button.json

Installation

Add Button with the shadcn CLI, or copy the source by hand. In this repo there's nothing to install — import it from @multidash/ui.

$ pnpm dlx shadcn@latest add https://multidash-app.vercel.app/r/button.json

Adds the component, the components it builds on, its npm packages and the theme tokens it uses. Using Multidash often? Add the registry to components.json once:

components.json
{
  "registries": {
    "@multidash": "https://multidash-app.vercel.app/r/{name}.json"
  }
}

Then add components by name:

$ pnpm dlx shadcn@latest add @multidash/button

Usage

import {
  Button,
  buttonVariants,
} from "@multidash/ui/components/button"

Examples

Status colors

Solid info, success, warning, highlight and destructive buttons.

Soft

A tinted background with colored text — for secondary actions that still carry meaning.

Sizes

With icon and loading state

As a link

Use asChild to apply button styles to another element.

View pricing