Skip to main content
Kbd renders an inline keyboard key indicator, the kind you see in documentation and shortcut overlays. Use it to show users which keys to press. A single Kbd can display one key or a full combination:

​
Basic Usage

​
Common Keys

​
Shortcut List

Use Kbd with Row and Text to build shortcut reference lists. The label can contain the full key combination:

​
API Reference

Kbd Parameters

​
label
str
default:"\"\""
The key label to display (e.g. "⌘", "K", "→", "Shift").
​
css_class
str | None
default:"None"
Additional Tailwind CSS classes.

​
Protocol Reference

Kbd
{
  "type": "Kbd",
  "id?": "string",
  "onMount?": "any",
  "label": "string (required)",
  "cssClass?": "string"
}
For the complete protocol schema, see Kbd.