命令面板
Command Palette
别名:命令搜索框快捷搜索框快速操作面板spotlight 搜索ctrl+k 搜索Mac 那种快捷搜索框cmd+k
这是什么
用快捷键（⌘K / Ctrl+K）唤出的浮动搜索面板：输入即筛选命令、页面或内容， 键盘上下选择、回车执行。macOS Spotlight 把它带入大众视野， 现在是效率工具和开发者产品的标配。
交互实验室
试一试，再决定怎么用打开面板，输入关键词，再尝试选择命令与退出。
正在加载实验室…
使用时关注什么
- 01搜索应覆盖命令别名，并给出无结果反馈。
- 02关闭后焦点应回到触发入口。
从参考到实践
AI 生成的视觉参考 · 点击查看完整图集
✓ 适用场景
- 功能多、层级深的产品（后台、开发工具、笔记软件）
- 目标用户是高频操作的高阶用户
- 想减少导航层级、直达任何地方
✕ 不适用场景
- 面向大众的浅层应用，用户不知道快捷键文化
- 移动端为主要场景（虚拟键盘体验差），改用底部搜索
- 命令总数极少（< 10 个），普通菜单就够了
常见形式
纯命令
Command-only
只列操作命令，VS Code 风格
万能搜索
Universal
命令 + 页面 + 内容 + 最近使用
AI 增强
AI-enhanced
自然语言查询 + 建议操作
实现要点
position: fixedbackdrop-filter: blurbox-shadowtransform-origin本质是受控弹层：fixed 居中 + 遮罩模糊；输入过滤用 useMemo 计算分组列表， 焦点锁定在输入框；键盘导航管理 activeIndex。开源实现可参考 cmdk（React）。 注意 aria-role="dialog" 与 focus trap。
平台 API
<dialog>role="combobox"横向对比
查看完整对比 →相关概念
承接查询意图并返回结果的内容发现页面：顶部常驻搜索框（保留查询词、可修改重搜）， 一侧是类型与筛选器，主体按相关度排列结果条目（标题 + 摘要 + 高亮命中词）， 底部用分页或无限滚动续接。空结果和无结果关键词是必须设计好的两个状态。
页面搭配使用由触发按钮就近弹出的一组操作菜单，用于收纳次要操作，保持界面整洁。 典型形态是「···」更多按钮；面板带阴影浮于内容之上，点击菜单项即执行并关闭， 危险操作以红色项与分隔线隔离。
组件替代方案固定在页面一侧（通常左侧）的垂直导航区，承载产品的主要层级入口。 后台管理系统的事实标准：顶部放品牌与全局搜索，侧边栏放模块树，内容区专注任务。
组件相似概念点击或右键触发的临时操作列表浮层：平铺或分组的命令项，选中即执行并关闭。 用于收纳非高频操作（更多、设置、删除），通常以「⋯」按钮或右键唤起。
组件相似概念