Components
Loading preview...
Displays keyboard input or shortcut keys with customizable styles and sizes.
npx shadcn@latest add https://21st.dev/r/sean0205/kbd-1import { Kbd } from '@/components/ui/kbd-1';
import { ArrowDown, ArrowUp, Command } from 'lucide-react';
export default function ButtonDemo() {
return (
<div className="flex items-center gap-4">
<Kbd variant="outline">
<ArrowUp />
</Kbd>
<Kbd variant="outline">
<ArrowDown />
</Kbd>
<Kbd variant="outline">space</Kbd>
<Kbd variant="outline">
<Command /> +K
</Kbd>
</div>
);
}