前端与 UI

pick-ui-library

给一个前端任务,只推荐一个精挑细选、态度鲜明的库。

这是什么

一个需要显式调用的查询 Skill,从一张精选清单里为你说明的任务匹配唯一推荐库,覆盖基础组件、动效、图表、虚拟列表、状态和样式。

Pick the right library for a given frontend task from a curated, opinionated list — numbers, OTP inputs, charts, command menus, virtualization, drag and drop, toasts, state, styling, and more. Only runs when explicitly i
来自上游 SKILL.md

它对设计意味着什么

  • 每个任务只给一个推荐,不用对着一堆选项纠结。
  • 先看 package.json,能复用项目里已有的库就复用。
  • 揪出手搓的下拉和提示条,换成无障碍的基础组件。

包含哪些内容

  • How to use this
  • UI components and primitives
  • Motion and visuals
  • Charts
  • State and styling
  • Common mismatches to catch

如何安装

pick-ui-library

  1. 克隆这个仓库。

    git clone https://github.com/emilkowalski/skills
  2. 把 Codex 指向这个 Skill 文件。

    skills/pick-ui-library/SKILL.md
  3. 然后描述你想要的界面,Codex 会照着这个 Skill 来做。

如何配合 Codex 使用

  1. 得显式调用,它不会自己触发。

  2. 说任务而不是库名,比如「我要做提示条」。

  3. 它点名一个库,讲清用法,再帮你接进去。

这里的每个插件都免费开源,并附上真实的上游源地址。

在 codex-design 清单上了解更多 ↗

下一步

用 Open Design 做设计,省掉那些配置

你可以自己装这个插件,也可以用 Open Design 在 Codex 外面套一整层精选设计层。自带 API Key,产出归你所有。