Modern Web Guidance 是一套由 Google Chrome、Microsoft Edge、Mozilla Firefox 和 MDN 团队联合维护的编程智能体 Skill 包：把最新 Web 平台的最佳实践和浏览器兼容性数据直接喂给编码智能体，让它少写过时写法、多用现代原生能力。项目 11 月 13 日登上 GitHub 日榜，截至当天已有 7,479 星、250 个 Fork，采用 Apache 2.0 开源协议。
为什么需要它
大模型的训练数据里有大量老代码，编码智能体常常默认用旧套路：本来浏览器原生就能搞定的事，它却生成一大坨 JavaScript；即使知道某个新 API 存在，也未必掌握真正能用于生产的现代写法。Modern Web Guidance 就是来补这块短板的：它的 CLI 会在智能体的上下文里返回经过专家筛选、按 Token 效率精简过的指南，并且通过评测不断砍掉模型本来就知道的内容。
250 个现代 Web 特性，一条命令装好
安装只需要一条命令，会打开交互式向导：
npx modern-web-guidance@latest install
支持 Claude Code、Codex、Cursor、Gemini CLI、Kimi 等多种智能体。装好后覆盖 250 个现代 Web 特性，包括 CSS 与布局 140 个、HTML 与 DOM 36 个、JavaScript 与 API 74 个，另外还有无障碍、内置 AI、性能、安全、PWA 等分类。内容涵盖容器查询、subgrid、oklch 颜色、Popover API、锚点定位、对话框、View Transitions、滚动驱动动画、原生翻译与摘要等内置 AI API。
不用安装也能先试
不装也能先体验三条命令：按关键词搜指南、按 ID 取某条指南全文、扫描代码库里的过时写法：
npx modern-web-guidance@latest search "animate a dialog modal backdrop" npx modern-web-guidance@latest retrieve "animate-to-from-top-layer" npx modern-web-guidance@latest legacy-scan .
项目还提供 .mwgrc 配置文件，可以按项目定制启用哪些指南；评测结果会定期更新在公开的 Eval Dashboard 上，用来证明这些指南确实能让智能体写出更现代的代码。
和站内相关内容
想一次配齐更多现成技能，可以参考25 个 Claude Code 技能合集；同样是官方或大厂背景的 Skill，Jane Street 开源的苏格拉底家教 Skill把智能体变成了严格私教；做界面时想让 AI 按品牌风格出图，可以看看83 个知名网站 DESIGN.md 合集。
适合谁用
适合每天让 Claude Code、Codex、Cursor 这类工具写前端的人：装一次，智能体以后写 CSS 和调用浏览器 API 时就会优先用现代原生方案，少引入重型 polyfill 和历史包袱。要注意它只覆盖 Web 平台的最佳实践，不教后端与业务逻辑，搭配其他领域的 Skill 一起用效果更好。
转自 GitHub 作者 GoogleChrome 的文章《Modern Web Guidance》，原文链接
