Modern Web Guidance

Modern Web Guidance is an open-source skill and CLI for coding agents working on web applications. It packages browser-platform guidance, compatibility context, and practical implementation patterns so an agent can prefer current native APIs instead of reflexively adding old libraries, polyfills, or large JavaScript workarounds. The project is stewarded by teams from Chrome, Edge, Mozilla, and MDN alongside the web-development community. It is guidance for implementation and review, not a substitute for testing an application in the browsers and assistive technologies your users actually use.

What it provides

• Searchable agent guidance: Install the skill in a supported coding-agent environment, then search for a concrete UI or platform task before retrieving a focused guide.
• Modernization scanner: npx modern-web-guidance@latest legacy-scan . statically identifies supported legacy patterns and links a finding to its suggested modern replacement.
• Curated coverage: version 1.0 documents 203 use cases across 250 web-platform features, including CSS layout, forms, accessibility, performance, UI components, PWA work, security, and built-in browser AI APIs.
• Compatibility-aware workflow: volatile or newly shipping single-engine features require explicit opt-in before retrieval, which helps keep experimental APIs from silently becoming a production recommendation.

A practical workflow

Run the CLI in a branch or clean checkout. First use legacy-scan to collect mechanical candidates, and open each linked guide before changing code. For a new feature, search with a specific primitive such as “confirmation modal dialog” rather than a vague product request, retrieve the result, then implement it within the application’s browser-support policy. Validate the outcome with the project’s tests, accessibility checks, and real target browsers; a guide cannot establish whether a proposed fallback, analytics requirement, or framework integration is correct for your product.

Where it fits

Modern Web Guidance is especially useful when an agent is changing frontend code with a long tail of historical examples in its training data. It can complement Playwright Automation for verification and ai-design-check for UI-quality checks. Unlike a component library, it does not ship a visual design system or replace an engineering team’s design tokens and support matrix. Unlike a general coding assistant, it narrows the context to web-platform decisions.

Limits and safe adoption

The repository’s public evaluation results are useful project evidence, not a guarantee for a particular model, framework, or browser baseline. Treat scanner findings as review prompts, especially where a legacy pattern exists for cross-browser behavior, product analytics, or security reasons. Do not enable an experimental API solely because a guide names it: check its browser status, user impact, and fallback path. Pin or review skill updates in managed environments just as you would any other development dependency.

Getting started

Run npx modern-web-guidance@latest install and select the coding-agent integration you use. Try a search or scan on one contained component, make the smallest reviewable change, and compare the result in the browsers your users rely on. This keeps the skill useful as a source of modern implementation options without turning it into an unreviewed source-code generator.

FAQ

Does it replace browser testing?

No. It supplies implementation guidance and static checks; browser, accessibility, performance, and product testing remain necessary.

Is it only for Chrome?

No. The project says it is stewarded with Edge, Mozilla, and MDN contributors, but each feature still needs to be checked against your own browser-support policy.

Conclusion

Modern Web Guidance gives coding agents a compact, reviewable way to look up current web-platform patterns. Start with a small scan or a narrowly described UI task, then keep normal engineering validation in control of the final decision.