Kbd displays keyboard keys and shortcut hints. Use ngs-kbd for one key such as ⌘, Shift, K, or Esc, and use ngs-kbd-group to show a key combination with plus signs between keys.
Use it in menus, command palettes, toolbars, help text, onboarding, and documentation when users need to see the shortcut for an action. Kbd is visual only; it does not register or handle keyboard events.
Do not use Kbd as a clickable button, status badge, tag, chip, normal body text, or shortcut handler. Use Button, IconButton, Badge, Chips, normal text, or application keyboard handling for those cases.
The NgStarter Angular Kbd component lets you display visual keyboard keys and shortcut hints. Use ngs-kbd for a single key such as Cmd, Shift, K, Esc, or an arrow key, and ngs-kbd-group for key combinations with plus signs between keys. It includes examples for Basic Keyboard, Keyboard group, Keyboard in menu, and Basic kbd.
Basic Keyboard
Use ngs-kbd to show one keyboard key in help text, menus, and shortcut hints.
Keyboard group
Use ngs-kbd-group for key combinations such as Command + Shift + K.
Keyboard in menu
Place Kbd hints beside menu actions when the action has a real keyboard shortcut handled elsewhere.