AI灵感世界AI Skills · 设计apple-bento-grid
入馆：2026 年 11 月 4 日
apple-bento-grid
让 AI 把项目数据做成苹果风格的便当格卡片，适合想晒成果的开发者。
- 生态
- Agent Skills
- Skill 分类
- 设计
- 创建者 / 机构
- Joe Hu（GitHub 用户 hubeiqiao）
它是什么
apple-bento-grid 是 Joe Hu（GitHub 用户 hubeiqiao）做的一个 Agent Skill。你在 AI 编程助手里描述想展示的数字和里程碑，它会生成一个独立的 HTML 文件，里面是排得很紧的便当格（bento grid）卡片，可以直接截图拿去用。它会先建议浅色或深色主题，挑版式，问你有没有 logo 或图片要放，最后还可以再做一版竖屏，方便发社交媒体。README 说它兼容 Claude Code、Codex、Cursor 等支持 Agent Skills 标准的工具。名字里的 Apple 指它参照的苹果设计风格，仓库没有说明和 Apple 公司有合作关系。
亮点：
- 有浅色和深色两种主题
- 有 7 种卡片，包括数字卡、柱状图卡和引言卡
- 有横版 4 列、横版 3 列和竖版 2 列三种版式
- 附带 Playwright 截图脚本，可以导出 2 倍清晰度的 PNG。
怎么用：
- 先在 Claude Code 里运行 /plugin marketplace add hubeiqiao/apple-bento-grid，再运行 /plugin install apple-bento-grid@apple-bento-grid-marketplace
- 也可以用 npx skills add hubeiqiao/apple-bento-grid 安装
- 最后对助手说 Use /apple-bento-grid to visualize my project stats。
适合谁：
想把项目进展、年度总结或产品数据做成一张好看的图，又不想打开设计软件的开发者和独立创作者。
使用前提：
- 要先装好一个支持 Agent Skills 的 AI 编程助手。
- 生成的页面要联网加载 Google Fonts。
- 截图导出是可选的，要另外装 Node 和 Playwright。
- 助手本身的费用另算。
- 许可证是 MIT。
以上根据项目公开说明整理，本站没有实际测试。