Modern Web Guidance

Keep your coding agent up to date with the latest web best practices

Modern Web Guidance embeds up-to-date web platform expertise directly into your coding agent's context. Backed by the Google Chrome team, it covers 102 modern web features across CSS & Layout, HTML & DOM, and JavaScript & APIs, plus 129 real-world developer use cases spanning accessibility, forms, performance, and UI components. The plugin steers your agent toward native browser APIs and modern standards instead of legacy patterns or unnecessary dependencies.

The skill uses an offline, CPU-efficient search model to find relevant guides — no API keys required. It distinguishes between "Baseline Widely available" features that need no fallbacks and newer features that require progressive enhancement, providing nuanced fallback recommendations for each. Evaluation results show agents improve from roughly 50–57% accuracy without guidance to 78–88% with it.

How to use: The skill activates automatically when your agent works on web UI, layout, scroll/motion features, performance optimization, or Web APIs. You can also invoke it directly:

  • Ask your agent to implement a feature — e.g., "Add a popover menu using modern web APIs" — and the skill will search for and retrieve the latest best-practice guide before writing code.
  • Use /modern-web-guidance to explicitly trigger a search for guidance on a specific web feature or use case.
  • Ask about specific modern features like View Transitions, Container Queries, Popover API, Anchor Positioning, or scroll-driven animations, and the agent will consult the latest standards-based patterns.

Works across frameworks (React, Vue, Angular) by adapting framework-agnostic guidance to your specific setup. Runs entirely offline with no external API calls — anonymous telemetry can be disabled via DISABLE_TELEMETRY=1.

Other plugins

Frontend Design

Frontend design skill for UI/UX implementation

Superpowers

Core skills library for Claude Code: TDD, debugging, collaboration patterns, and proven techniques

Code Review

Automated code review for pull requests using multiple specialized agents with confidence-based scoring

Context7

Upstash Context7 MCP server for up-to-date documentation lookup. Connects to Context7's hosted remote MCP server (https://mcp.context7.com/mcp) — no local Node.js or npx required — to pull version-specific documentation and code examples directly from source repositories into your LLM context. Authenticate with Context7 when prompted.

Code Simplifier

Agent that simplifies and refines code for clarity, consistency, and maintainability while preserving functionality

Playwright

Browser automation and end-to-end testing MCP server by Microsoft. Enables Claude to interact with web pages, take screenshots, fill forms, click elements, and perform automated browser testing workflows.