Button

Button

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

Variant

Size

DisabledLoading

Installation

npx radk add button

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

<Button variant="outline">Button</Button>

import { Mail } from "lucide-react"

<Button>
  <Mail className="mr-2 h-4 w-4" /> Login with Email
</Button>

import { Loader2 } from "lucide-react"

<Button disabled>
  <Loader2 className="mr-2 h-4 w-4 animate-spin" />
  Please wait
</Button>

Use the asChild prop to render as a different element:

import Link from "next/link"

<Button asChild>
  <Link href="/login">Login</Link>
</Button>