Kbd

To display keyboard shortcuts in your documentation, use the <Kbd> component.

Preview

Command + Shift + S CommandShiftS Control + Shift + S ControlShiftS Control + Shift + S ControlShiftS

Import

import { Kbd } from 'starlight-kbd/components'

Usage

Use the <Kbd> component to display keyboard shortcuts in your documentation.

Different shortcuts can be provided for all the supported keyboard types configured in your documentation. At least one shortcut matching the default keyboard type should be provided.

When a keyboard type is not provided, the default keyboard type is used.

import { Kbd } from 'starlight-kbd/components'

Use <Kbd mac="Command+S" windows="Control+S" /> to get started.

Preview

Use Command + S CommandS Control + S ControlS Control + S ControlS to get started.

Check the shortcut syntax guide for more information on how to write keyboard shortcuts.

<Kbd> Props

The <Kbd> component accepts any number of props representing keyboard shortcuts for different keyboard types with at least one matching the default keyboard type.