Navigation
Command Palette
A searchable command palette with keyboard shortcuts, grouped results, and recent commands.
by mcpSkills
Framework
nextjs
UI Library
shadcntailwind
Difficultyadvanced
English Prompt
Create a command palette modal triggered by ⌘K. Include a search input at the top, grouped results (Recent, Pages, Actions), keyboard navigation with arrow keys, highlighted selection, and a footer showing keyboard shortcuts. Use shadcn/ui Dialog, Command, and Badge components and Tailwind CSS. Make it accessible with focus trapping and Escape to close.
Chinese Prompt
创建一个通过 ⌘K 触发的命令面板弹窗。顶部包含搜索输入、分组结果（Recent、Pages、Actions）、方向键键盘导航、高亮选择和显示键盘快捷键的页脚。使用 shadcn/ui Dialog、Command 和 Badge 组件以及 Tailwind CSS。使其可访问，包含焦点捕获和 Escape 关闭。
Overview
A command palette for power users to navigate and execute actions quickly. Includes search, grouping, and keyboard shortcuts.
Features
- ⌘K keyboard trigger
- Search input
- Grouped command results
- Arrow key navigation
- Highlighted selection
- Shortcut hints footer
- Focus trap and Escape close
Usage
Copy the prompt into v0 or Cursor. Wire commands to your app routes and actions.
Customization
Modify the prompt to:
- Add command icons
- Support nested command pages
- Show recent searches
- Add fuzzy search matching