Kbd

Kbd defines how EnterUI handles compact keyboard key styling, including default structure, accessible states, and token-driven styling.

#Default usage

<div className="docs-preview-row">
  <Kbd>Cmd</Kbd>
  <Kbd>K</Kbd>
  <span className="docs-preview-muted">Open command menu</span>
</div>

#Import

import { Kbd } from "@froggdesign/enter-ui-react";

#Accessibility

Kbd renders a semantic kbd element. Keep shortcut text short and match the platform where possible.

#API

• Extends native kbd element props.
• Use children for the displayed key label.

#Styling

Every exported component accepts className when it renders an element. EnterUI styles use .eui-* classes and --eui-* variables mapped from FroggDesign theme tokens.