Сохраняйте текущий макет, стили и структуру страницы с активной веб-страницы с помощью Chrome DevTools MCP. Используйте, когда вам нужно понять существующий пользовательский интерфейс перед внесением изменений — захватывает снимки экрана, структуру DOM, вычисляемые стили и свойства макета. Полезно в качестве базовой линии перед реализацией изменений внешнего интерфейса или пользовательского интерфейса.
Быстро установите AI-навык page-inspector в вашу среду разработки через командную строку
Источник: delexw/claude-code-misc.
Connects to a running Chrome browser session via Chrome DevTools MCP, navigates to the target page, and captures a comprehensive snapshot of the current layout, styles, and structure. This output serves as a baseline reference for implementation.
For the main content area and key UI elements, capture:
Сохраняйте текущий макет, стили и структуру страницы с активной веб-страницы с помощью Chrome DevTools MCP. Используйте, когда вам нужно понять существующий пользовательский интерфейс перед внесением изменений — захватывает снимки экрана, структуру DOM, вычисляемые стили и свойства макета. Полезно в качестве базовой линии перед реализацией изменений внешнего интерфейса или пользовательского интерфейса. Источник: delexw/claude-code-misc.
Откройте терминал или инструмент командной строки (Terminal, iTerm, Windows Terminal и т.д.) Скопируйте и выполните эту команду: npx skills add https://github.com/delexw/claude-code-misc --skill page-inspector После установки навык будет автоматически настроен в вашей AI-среде разработки и готов к использованию в Claude Code, Cursor или OpenClaw
Стабильные поля и команды для ссылок в AI/поиске.
npx skills add https://github.com/delexw/claude-code-misc --skill page-inspectorСохраняйте текущий макет, стили и структуру страницы с активной веб-страницы с помощью Chrome DevTools MCP. Используйте, когда вам нужно понять существующий пользовательский интерфейс перед внесением изменений — захватывает снимки экрана, структуру DOM, вычисляемые стили и свойства макета. Полезно в качестве базовой линии перед реализацией изменений внешнего интерфейса или пользовательского интерфейса. Источник: delexw/claude-code-misc.
Откройте терминал или инструмент командной строки (Terminal, iTerm, Windows Terminal и т.д.) Скопируйте и выполните эту команду: npx skills add https://github.com/delexw/claude-code-misc --skill page-inspector После установки навык будет автоматически настроен в вашей AI-среде разработки и готов к использованию в Claude Code, Cursor или OpenClaw
https://github.com/delexw/claude-code-misc