Keyboard Shortcuts
Consistent keyboard shortcuts and context-menu patterns across the Sitka product suite — mac-first, with Windows equivalents documented.
Chord Anatomy
Global Shortcuts
Every Sitka product must support these chords. Implement them at the application level so they work regardless of which panel or element has focus.
| Shortcut | Scope | Action |
|---|---|---|
⌘K | Global | Open command palette |
⌘/ | Global | Toggle sidebar |
⌘⇧P | Global | Quick actions menu |
⌘, | Global | Open Preferences |
⌘W | Global | Close current panel |
⌘Z | Editing | Undo last action |
⌘⇧Z | Editing | Redo |
⌘S | Editing | Save / commit changes |
⌘A | Selection | Select all |
⌘⇧A | Selection | Deselect all |
↵ | List | Open / confirm focused item |
⌘↵ | List | Open in new tab / secondary view |
⌫ | List | Delete focused item |
↑ / ↓ | List | Move focus through list |
Esc | Global | Dismiss overlay / cancel |
Modifier Key Reference
Symbols used throughout this documentation and in the UI. Always display modifiers in order: Ctrl → Alt → Shift → Cmd → Key.
| Symbol | Name | Windows | Notes |
|---|---|---|---|
⌘ | Command (Cmd) | Ctrl | Primary modifier for most actions |
⌥ | Option (Alt) | Alt | Alternate or secondary action |
⌃ | Control (Ctrl) | — | System-level; use sparingly in apps |
⇧ | Shift | Shift | Extends or inverts the action |
⌫ | Delete (Backspace) | Del | Destructive — confirm before acting |
↵ | Return / Enter | Enter | Confirm or open primary action |
Esc | Escape | Esc | Cancel, dismiss, or go back |
Context Menus
Context menus surface actions relevant to the focused element without consuming toolbar space. They are triggered by right-click on desktop and long-press on touch.
| Rule | Detail |
|---|---|
| Triggered by | Right-click (mouse), long-press (touch ≥ 500ms), or ⌘⌥Space / platform equivalent (keyboard). |
| Scope | Items must be contextually relevant to the focused or hovered element. Don't include global actions. |
| Order | Open / primary action first. Destructive actions last, separated by a divider. |
| Shortcuts | Show the keyboard shortcut for every action that has one. Right-align in monospace. |
| Submenus | Max one level of nesting. If you need two levels, promote the submenu to a dedicated panel. |
| Dismissal | Closes on: item selection, click-outside, Esc, window blur, scroll > 8px. |
| Width | Min 160px, max 280px. Never wider than the viewport; clamp and scroll if items overflow. |
Displaying Shortcuts in the UI
Use the <kbd> element for keyboard shortcut labels. The design system provides a .kbd utility class that renders the correct font, size, border, and background for both light and dark themes.
| Context | Placement | Format |
|---|---|---|
| Tooltip | After label | ⌘K in a <kbd> element |
| Menu item | Right-aligned | ⌘Z right-aligned in monospace |
| Empty state | Inline with text | "Press ⌘K to start" |
| Onboarding | Callout card | Large key cap illustration + action |
| Settings page | Editable field | Record + display the full chord |
Accessibility
- →Every keyboard shortcut must have a menu or button equivalent — shortcuts are enhancements, not the only path.
- →Announce shortcut hints to screen readers by placing them inside a visually-hidden <span aria-hidden="false"> after the label.
- →Never override browser or OS system shortcuts (⌘T, ⌘N, ⌘Q, F5, etc.). Map conflicts to less common chords.
- →Allow users to discover shortcuts via a searchable shortcut reference accessible from the ⌘K palette.
- →Respect prefers-reduced-motion — do not tie shortcuts to animated transitions that cannot be disabled.
- →Context menus triggered by keyboard must set focus to the first item and trap focus within the menu. Esc returns focus to the trigger.