Murasaki
Components

Kbd

Displays a keyboard key or shortcut.

⌘K

Usage

import { Kbd, KbdGroup } from '@murasakijs/ui'

<KbdGroup aria-label="Command K">
  <Kbd>⌘</Kbd><span aria-hidden="true">+</span><Kbd>K</Kbd>
</KbdGroup>

Kbd renders the semantic <kbd> element. A visual shortcut is not a keyboard implementation: document the action in text, implement the shortcut separately, and avoid overriding OS or assistive-technology shortcuts.

Improve this page on GitHub

Empty

Explains an empty state and offers a useful next action.

Scroll Area

Adds consistently styled scrollbars without changing native scrolling.

On this page

Usage