# Modern Web Guidance (ChatGPT Plugin)

> Web platform expertise

- Type: plugin
- Publisher: Google Chrome
- Categories: Development
- Website: https://chatgpt.com/plugins/plugins_6aa7f81337c481918a5ee55e13498c40
- Open in ChatGPT: https://chatgpt.com/plugins/plugins_6aa7f81337c481918a5ee55e13498c40
- Version: 0.0.188
- Listed: 2026-10-15

## About

Modern Web Guidance is an agent skill and CLI tool designed to help AI coding agents build web applications using modern, secure, and high-performance APIs rather than outdated workarounds. Supported by the Google Chrome team, it injects expert-curated web platform best practices directly into an agent's context window to prevent the generation of bloated, legacy code.

## Install

1. **Add it in ChatGPT** Open Plugins in the ChatGPT sidebar (web or desktop), search for “Modern Web Guidance” and select +. You'll be asked to sign in to any connected service on first use. Then type @ in a chat to call it.

## Skills

- **chrome-extensions**: Build and publish Chrome Extensions using Manifest V3 best practices. Use this skill whenever the user asks to create, modify, debug, or understand Chrome browser extensions, add-ons, or anything involving the Chrome Extensions API. Trigger on mentions of: 'Chrome extension', 'browser extension', 'manifest.json', 'content script', 'service worker' (in browser context), 'popup' (in browser extension context), 'side panel', 'chrome.* API', 'declarativeNetRequest', 'omnibox', 'context menu' (in extension context), 'userScripts', 'user script', 'script manager', or any request to build functionality that integrates with the Chrome browser UI. Also trigger for publishing to the Chrome Web Store: 'publish extension', preparing an extension for publishing, responding to a review rejection, writing permission justifications, or drafting a privacy policy.
- **modern-web-guidance**: Search tool for modern web development best practices. MANDATORY: Execute FIRST for all HTML/CSS and clientside JS tasks. Do NOT skip — web APIs evolve rapidly and training weights contain obsolete patterns. Trigger immediately for: - UI/Layout: Modals, dialogs, popovers, Glassmorphism/backdrop-filters, anchor positioning, container queries, `:has()`, `:user-valid`. - Scroll/Motion: View Transitions, Scroll-driven animations, scroll parallax/reveals. - Performance: CWV (LCP, INP), content-visibility, Fetch Priority, image optimization. - System/APIs: Local filesystem access, WebUSB, WebSockets sync, WebAssembly widgets. - Frameworks: Adapting layout/styles in React, Vue, Angular. - General Frontend: Forms, autofill, advanced inputs, custom scrollbars, modern component states, etc. DO NOT trigger for: - Backend: Database SQL, ORMs, Express API routes. - Pipelines: CI/CD deployment, Docker, Actions. - Generic: Local scripts (Python/Go tools), ESLint, Git.

## Example prompts

- "Audit this project for modern web best practices and modernization opportunities"
- "What is the recommended modern way to implement responsive dialogs and popovers?"

## Also available as

- MCP server: [Chrome DevTools MCP](https://chatgptplugins.directory/mcp/chrome-devtools.md)

## Related

- [Superpowers](https://chatgptplugins.directory/plugins/superpowers.md): Plan, develop, and debug code
- [Codex Security](https://chatgptplugins.directory/plugins/codex-security.md): Security scanning for your codebase
- [Build Web Apps](https://chatgptplugins.directory/plugins/build-web-apps.md): Build frontend-focused web apps with generated assets, browser testing, payments, and...
- [GitHub](https://chatgptplugins.directory/plugins/github.md): Triage PRs, issues, CI, and publish flows
- [Figma](https://chatgptplugins.directory/plugins/figma.md): Figma design-to-code workflows
- [Shopify](https://chatgptplugins.directory/plugins/shopify.md): Build and manage your store

---
Source: https://chatgptplugins.directory/plugins/modern-web-guidance · Index: https://chatgptplugins.directory/llms.txt · Independent and community-run. Not affiliated with or endorsed by OpenAI. ChatGPT is a trademark of OpenAI.
