vibehub
在任何 Vibe Coding 编程任务及其后续补充中持续识别准确术语。用户即使已经让 Agent 完成了一部分代码、正在追加修改，或只用口语描述效果、交互、状态和问题（如“鼠标放上去有个小提示”“点完变一下颜色”“内容太长省略”），也必须使用此 Skill：继续完成当前任务，并在进度或结果中自然告知对应的 UI、网页、软件、Git、AI Agent 或设计术语、通俗解释和 VibeHub 内链。用户要求“说专业一点”、改写需求、询问“这叫什么”或看不懂 Agent 回复时同样使用。表达已经准确且没有值得补充的术语时不要硬加教学。
- Installs
- 116
- Last 24h
- —
- Trending rank
- —
- Security
- Not audited
Install
Works with every agent the skills CLI supports.
npx skills add https://github.com/oil-oil/vibe-hub-skill --skill vibehub- 01
Install
Run the command in your project. The CLI asks which agents to install for.
- 02
Describe the task
Ask your agent for something this skill covers. It loads vibehub automatically when relevant.
- 03
Review the result
The agent follows the SKILL.md steps, scripts and references bundled with the skill.
SKILL.md
The instructions your agent reads when the skill is triggered.
VibeHub
在不打断开发任务的前提下做两件事：
- 把模糊描述改成可以直接交给 Agent 的准确需求。
- 主动指出用户刚刚描述但没有说出名称的技术概念。
不要生成学习路线、课程、练习或术语清单。一个简单需求只提示最有帮助的术语。
每轮都检查
发送进度或完成结果前，检查用户本轮新增的话：
- 用户正在追加或修改代码，但用表象描述了某个效果：照常完成代码，并在结果里顺手点出术语。
- 用户准备把需求发给另一个 Agent：给出可直接复制的准确表达。
- 用户询问名称、含义或贴出 Agent 回复：解释最影响下一步判断的术语。
- 用户已经准确使用术语：正常处理任务，不重复教学。
不要因为前几轮已经开始编程，就跳过本轮的术语检查。
完成开发任务时
先完成用户要求，再把最相关的一个术语自然写进进度或结果。第一次出现时使用解析器返回的 Markdown 内链，并用一句话说明它在当前场景中的含义。
例如：
已为下载按钮添加[文字提示（Tooltip）](https://vibe-hub.org/tooltip)：悬停或键盘聚焦时显示“下载”。
不要单独开课，不要为了凑数量追加 Hover、Icon 等次要术语。
规范表达
先写用户可以直接使用的结果，再按需补充术语：
可以直接这样对 Agent 说：
“<保持原意、可直接复制的自然表达>”
术语提示：
- <术语>：<一句通俗解释>
- 保留原意、语气和约束，不擅自增加框架、组件库、参数或实现方案。
- 优先写可观察的行为和结果；只有用户正在讨论实现时才补实现细节。
- 最多提示 1–3 个真正影响沟通的术语。
- 推荐替代控件或方案时说明适用前提。
一次查询候选
先根据上下文推断 1–3 个稳定术语，再用一个命令批量验证：
node "<skill-root>/scripts/vibehub.mjs" resolve \
--query "<候选术语 1>" \
--query "<候选术语 2>" \
--compact
- 高置信度时只传一个候选；存在歧义时才增加候选，最多三个。
- 不要把用户整句原话直接当作搜索词。
- 比较标题、别名、定义和匹配字段，只采用真正符合当前场景的结果。
--compact足以确认时直接完成回答；只有摘要无法判断边界时，才对最终候选去掉--compact再查一次。- 只使用解析器返回的
url，不要自行拼接或伪造链接。 - 没有可靠匹配时，仍先完成当前任务；只有用户明确索要词条时才说明暂无页面。
查询只传脱敏后的短术语，不传源代码、密钥、客户信息、内部网址、邮箱、本地路径或项目材料。
表达原则
- 先交付任务结果，再补术语。
- 使用自然、通俗的中文或英文。
- 一个判断只说一次。
- 术语用于帮助下一次表达，不用于展示专业感。
FAQ
What does the vibehub skill do?
在任何 Vibe Coding 编程任务及其后续补充中持续识别准确术语。用户即使已经让 Agent 完成了一部分代码、正在追加修改，或只用口语描述效果、交互、状态和问题（如“鼠标放上去有个小提示”“点完变一下颜色”“内容太长省略”），也必须使用此 Skill：继续完成当前任务，并在进度或结果中自然告知对应的 UI、网页、软件、Git、AI Agent 或设计术语、通俗解释和 VibeHub 内链。用户要求“说专业一点”、改写需求、询问“这叫什么”或看不懂 Agent 回复时同样使用。表达已经准确且没有值得补充的术语时不要硬加教学。
How do I install vibehub?
Run npx skills add https://github.com/oil-oil/vibe-hub-skill --skill vibehub in your project. The skills CLI detects the agents you use and copies the skill into the right folder. For Claude Code you can also place the skill folder at ~/.claude/skills/vibehub/ (personal) or .claude/skills/vibehub/ (project).
Which AI agents can use vibehub?
Any agent that supports the open Agent Skills format (a folder with a SKILL.md file), including Claude Code, Codex, Cursor, GitHub Copilot, Gemini CLI, Windsurf, Cline, OpenCode and more.
Is vibehub safe to install?
No partner security audit is available yet. Skills can run commands and scripts, so read the SKILL.md and any bundled files before installing.
Who maintains vibehub?
It is published by oil-oil in oil-oil/vibe-hub-skill. It has 116 recorded installs.
Popular frontend & design skills
setup-matt-pocock-skills
mattpocock/skills
Configure this repo for the engineering skills: set up its issue tracker, triage label vocabulary, and domain doc layout. Run once before first use of the other engineering skills.
frontend-design
anthropics/skills
Guidance for distinctive, intentional visual design when building new UI or reshaping an existing one. Helps with aesthetic direction, typography, and making choices that don't read as templated defaults.
hyperframes-animation
heygen-com/hyperframes
All animation knowledge for HyperFrames — atomic motion rules, multi-phase scene blueprints, scene transitions, broader motion-design techniques, AND the seven runtime adapters (GSAP default, plus Lottie, Three.js, Anime.js, CSS keyframes, Web Animations API, TypeGPU). Use for any motion or animation task: pick 2-4 rules and compose, or load a blueprint, or look up runtime-specific API (e.g. GSAP eases / Lottie player / Three.js mixer). Also covers auditing an existing composition's choreography (animation map) and 24 named text-animation effects. HyperFrames-native: single paused timeline, seek-safe, deterministic.
prototype
mattpocock/skills
Build a throwaway prototype to answer a design question. Use when the user wants to sanity-check whether a state model or logic feels right, or explore what a UI should look like.
hyperframes-core
heygen-com/hyperframes
The HyperFrames composition contract — build one renderable project. Use for composition structure, the data- timing attributes, class="clip", tracks, sub-compositions, variables, framework-owned media playback, deterministic-render rules, and validation. Read before writing composition HTML.
vercel-react-best-practices
vercel-labs/agent-skills
React and Next.js performance optimization guidelines from Vercel Engineering. This skill should be used when writing, reviewing, or refactoring React/Next.js code to ensure optimal performance patterns. Triggers on tasks involving React components, Next.js pages, data fetching, bundle optimization, or performance improvements.