# Kbd

A keycap for shortcut hints, such as the K in Cmd K.

Source page: https://sproutboat.com/ikada/components/kbd

## Installation
```sh
npx shadcn@latest add https://sproutboat.com/ikada/r/kbd.json
```
Or from the package: `import { Kbd } from "@sproutboat/ikada";`
## Usage
```tsx
import { Kbd } from "@/components/ikada/kbd";

<Kbd>⌘</Kbd>
<Kbd>K</Kbd>
<Kbd>Esc</Kbd>
<Kbd>↵</Kbd>
```
## Examples
### Keys
A keycap for shortcut hints. Decorative text: the control it sits in carries aria-keyshortcuts.
```tsx
<Kbd>⌘</Kbd>
<Kbd>K</Kbd>
<Kbd>Esc</Kbd>
<Kbd>↵</Kbd>
```
### In a hint

```tsx
<p className="flex items-center gap-1.5 text-sb-sm text-fg-muted">
  <Kbd>⌘</Kbd>
  <Kbd>K</Kbd>
  <span className="ms-1">to search sprouts</span>
</p>
```
## Props
Source: https://github.com/baronunread/ikada/blob/main/src/components/kbd.tsx