Kbd

A component for displaying keyboard keys and shortcuts.

Installation

pnpm dlx shadcn-svelte@latest add https://coss-sv.vercel.app/r/kbd.json

<script lang="ts">
  import * as Kbd from "$lib/components/ui/kbd/index.js";
</script>

Single key:

<Kbd.Root>K</Kbd.Root>

Multiple keys:

<Kbd.Group>
  <Kbd.Root>⌘</Kbd.Root>
  <Kbd.Root>K</Kbd.Root>
</Kbd.Group>

Displays a single keyboard key. Native kbd attributes pass to the element.

Prop	Type	Default
`class`	`string`

Groups multiple keyboard keys for key combinations.

Prop	Type	Default
`class`	`string`