Components
Raised Button
A 3D raised button with a glossy top highlight, press animation, and customizable colors that auto-adjust text contrast.
import { RaisedButton } from "@/components/ui/raised-button";
export default function RaisedButtonDemo() {
return (
<div className="flex min-h-[220px] w-full flex-wrap items-center justify-center gap-4 bg-background p-8">
<RaisedButton>Get Started</RaisedButton>
<RaisedButton color="#6366f1">Indigo</RaisedButton>
<RaisedButton color="#10b981">Emerald</RaisedButton>
<RaisedButton size="lg" color="#f59e0b">
Amber
</RaisedButton>
</div>
);
}