Back to Components

Button

Pill button with default, outline, secondary and ghost variants plus four sizes.

class-variance-authority

Preview

Installation

Install the component using the CLI.

npx shadcn@latest add https://yash-sakre.github.io/Yash-Sakre/r/button.json

Usage

Import the component:

import { Button } from "@/components/ui/button";

Use it in your code:

<Button variant="default">Click me</Button>

Props

PropertyTypeDefaultDescription
variant"default" | "outline" | "secondary" | "ghost""default"Visual style.
size"sm" | "default" | "lg" | "icon""default"Height + horizontal padding.
...propsButtonHTMLAttributes—All native <button> attributes.