Chrome-расширения для разработчиков

Бесплатные расширения, ускоряющие работу с JSON, API, GitHub, кодом и текстом. Скачайте zip и установите через «Загрузить распакованное».

← Все руководства

Chrome: SEO Проверка — Проверяет SEO страницы: мета-теги, заголовки, изображения, скорость загрузки и битые ссылки.
Chrome: Цвет и шрифт — Показывает цвет, шрифт и размер любого элемента на странице; пипетка и палитра страницы.
Chrome: Тест скорости — Измеряет скорость интернета одним нажатием: пинг, загрузка и отдача. Подскажет, хватит ли для видеозвонков, игр и 4K.
Chrome: JSON Зеркало — Показывает JSON-ответы цветным сворачиваемым деревом: поиск, копирование пути, форматирование.
Chrome: Мастер запросов — Для разработчиков: блокировка запросов, перенаправление, изменение заголовков и mock-ответы, пока бэкенд не готов.
Chrome: Адаптивный просмотр — Показывает сайт рядом в размерах телефона, планшета и компьютера.
Chrome: Определитель технологий — Определяет, на чём сделан сайт: фреймворк, CMS, библиотеки, аналитика, сервер и хостинг.
Chrome: Границы элементов — Показывает границы всех элементов страницы цветными линиями — для поиска ошибок вёрстки.
Chrome: Ящик разработчика — Base64, URL, JWT, метки времени, UUID, хеши, Regex, JSON и системы счисления — в одном окне, без интернета.
Chrome: GitHub Помощник — На GitHub: панель дерева файлов, размеры файлов и репозитория, скачивание одной папки в ZIP.
Chrome: Web Vitals онлайн — Показывает LCP, CLS, INP, FCP и TTFB в углу страницы в реальном времени.
Chrome: Проверка доступности — Проверяет удобство страницы для людей с ограниченными возможностями: контраст, alt-тексты, названия кнопок, label'ы, порядок…
Chrome: LeetCode → GitHub — Когда решение на LeetCode принято (Accepted), код и условие задачи автоматически сохраняются в ваш репозиторий GitHub.
Chrome: Смена User-Agent — Сайт будет считать вас iPhone, Android, планшетом или другим браузером. Для одной вкладки или для всех.
Chrome: Уведомления GitHub — Уведомления GitHub, ваши открытые PR и PR, ждущие вашего ревью, — на панели. Сообщает о новых.
Chrome: Редактор cookie — Просмотр, редактирование, добавление и удаление cookie текущего сайта, экспорт и импорт в JSON/Netscape.
Chrome: REST Клиент — Лёгкая альтернатива Postman: запросы, заголовки, тело, авторизация, переменные, история, сохранённые запросы и cURL.
Chrome: Сниппеты кода — Храните часто используемые фрагменты кода: язык, теги, поиск, подсветка. Сохранение с сайта правой кнопкой и вставка в любое поле…
Chrome: Перезагрузка расширений — Для разработчиков расширений: при сохранении кода в папке ваше (unpacked) расширение перезагружается автоматически, при желании…
Chrome: Редактор хранилища — Просматривайте localStorage, sessionStorage и IndexedDB сайта таблицей в боковой панели: поиск, редактирование, удаление, экспорт…
Chrome: Ошибки консоли — Число JavaScript-ошибок, необработанных promise и console.error на значке. Список, стек и копирование без DevTools; уведомления в…
Chrome: Копирование элемента — Выберите кнопку, карточку или блок на сайте — получите чистый HTML + CSS со всеми стилями. Живой просмотр, копирование, скачивание…
Chrome: Поиск по документации — Наберите в адресной строке 'd mdn flex' — и сразу попадёте в документацию MDN. React, Python, Node, PHP, Laravel, Django, Go…
Chrome: Генератор иконок — Все иконки 16–1024 из одного изображения: favicon.ico, Apple touch, PWA, расширение Chrome, Android mipmap, iOS. Фон, отступы…
Chrome: Проверка PWA — Можно ли установить сайт как PWA? Поля манифеста, иконки (192/512/maskable), service worker, кэш и офлайн, HTTPS, мета-теги —…
Chrome: Медленный интернет — Проверьте сайт в медленной сети: 2G, 3G, медленный 4G, офлайн или своя скорость/задержка; замедление CPU. Только для выбранной…
Chrome: Скриншот кода — Превращайте код в красивую картинку (как Carbon): темы, градиентный фон, кнопки окна, номера строк, заголовок. Скачивание PNG или…
Chrome: Конвертеры — Конвертеры для разработчиков в одном месте: HTML → JSX, CSS → Tailwind, JSON → TypeScript, cURL → fetch/axios, JSON → Go struct.…
Chrome: Сборщик SVG — Собирает все SVG-иконки и изображения страницы (inline, img, CSS-фон, спрайты) и оптимизирует. Копирование как SVG, JSX или data…
Chrome: Наблюдатель WebSocket — Следите за WebSocket и EventSource (SSE) страницы в боковой панели: время и размер сообщений, JSON-вид, фильтр, пауза, экспорт.
Chrome: Отчёт об ошибке — Отправьте ошибку сайта одним нажатием: скриншот с пометками, логи консоли, неудачные сетевые запросы и данные браузера — в…
Chrome: Визуальная разница — Сохраните «до» и сравните после изменений: разница подсвечена красным, процент, режимы рядом, ползунок и наложение. Для проверки…
Chrome: Переключатель аккаунтов — Для тестирования: сохраняйте сессии нескольких аккаунтов одного сайта (админ, клиент, курьер...) и переключайтесь одним нажатием —…
Chrome: Место, время и язык — Проверьте сайт в другом городе, часовом поясе и языке: геолокация, timezone, locale (формат дат/чисел) и Accept-Language — только…
Chrome: Домен и SSL — Показывает, когда истекают SSL-сертификат и домен сайта, записи DNS (A, AAAA, MX, NS, TXT, CNAME). Добавьте свои сайты —…
Chrome: Cron и SQL — Объясняет cron-выражение и показывает следующие запуски; красиво форматирует SQL или сжимает в одну строку. Без интернета.
Chrome: Редактор README — Пишите README.md с живым превью как на GitHub: готовые шаблоны, бейджи, кнопки таблиц и чек-листов, генератор оглавления. Открытие…
Chrome: Просмотр Flex/Grid — Рисует поверх страницы все Flexbox и Grid контейнеры: линии и номера сетки, столбцы/строки, gap (штриховка), направление flex и…
Chrome: Неиспользуемый CSS — Находит в CSS-файлах страницы правила, не применённые ни к одному элементу: процент и объём по файлам, список селекторов, режим…
Chrome: Индикатор брейкпоинтов — В углу всегда видны ширина окна и текущий брейкпоинт (Tailwind sm/md/lg/xl, Bootstrap или свой). Находит и медиазапросы сайта…
Chrome: Тени и градиенты — Живое редактирование box-shadow (многослойные, inset), text-shadow и градиентов (linear, radial, conic): готовые образцы, точки…
Chrome: Объяснитель Tailwind — Наведите на элемент — каждый класс Tailwind объясняется и показывается, какой CSS он даёт (sm:, md:, hover:, dark:, [arbitrary]…
Chrome: Переключатель тёмной темы — Проверяйте сайт в тёмной и светлой теме в один клик: эмуляция prefers-color-scheme и принудительный тёмный фильтр.
Chrome: Аудит изображений — Проверяет изображения на странице: тяжёлые файлы, избыточный размер, устаревший формат (совет WebP/AVIF), нет alt и width/height, ошибки la…
Chrome: Сетевой лог на странице — Смотрите fetch и XHR запросы прямо на странице без DevTools: статус, время, заголовки, тело ответа, копирование cURL.
Chrome: Консоль телефона на компьютере — Смотрите console.log, ошибки и предупреждения страницы с телефона на компьютере в реальном времени. Без кабеля и USB-отладки.
Chrome: Анализ бандлов — Размер JS-файлов страницы (сжатый и исходный), распределение по доменам и список используемых библиотек.
Chrome: Предупреждение об устаревших библиотеках — Определяет версии JS-библиотек на сайте и предупреждает об известных уязвимостях (CVE) и неподдерживаемых версиях.
Chrome: Поиск React-компонентов — Наведите на элемент — покажет, какому React-компоненту он принадлежит, в каком файле и строке, и цепочку компонентов. Открывает в VS Code в…
Chrome: Счётчик ререндеров — Считает в реальном времени, сколько раз перерисовывается каждый React-компонент, и показывает на странице. Для поиска лишних ререндеров.
Chrome: Инспектор Vue и Svelte — Выберите элемент — увидите props, состояние (data/setup) и файл компонента Vue или файл:строку компонента Svelte. Без установки DevTools.
Chrome: Версия фреймворка — Показывает, на каких фреймворках и библиотеках сделан сайт, их версии и насколько они отстают от последней.
Chrome: Конструктор GraphQL-запросов — Загружает схему API, собирайте GraphQL-запрос галочками, редактируйте с автодополнением и смотрите результат.
Chrome: Просмотр Swagger/OpenAPI — Превращает спецификацию OpenAPI 3 и Swagger 2 (JSON или YAML) в удобную документацию с поиском: эндпоинты, параметры, схемы и примеры.
Chrome: Тестовый адрес для вебхуков — Получите публичный адрес для вебхуков в один клик и смотрите входящие запросы (заголовки, тело, query) в реальном времени. Можно пересылать…
Chrome: «Go to definition» на GitHub — Читая код на GitHub, переходите к объявлению функции, класса или переменной по Ctrl (⌘ на Mac) + клик — поиск внутри репозитория.
Chrome: Граф истории коммитов — Показывает ветки и коммиты репозитория GitHub деревом, как git log --graph: слияния, ответвления, метки.
Chrome: Состояние зависимостей — Устарели ли пакеты из package.json (npm) или requirements.txt (PyPI): последняя версия, отставание на мажор и deprecated-пакеты.
Chrome: Статистика репозитория — Краткий отчёт о репозитории GitHub: звёзды, форки, открытые issue и PR, доли языков, активные участники и активность коммитов за год.
Chrome: AI-сообщение коммита — AI пишет точное и краткое сообщение коммита по git diff: в стиле Conventional Commits, на английском, узбекском или русском.
Chrome: Заголовки безопасности — Проверяет наличие CSP, HSTS, X-Frame-Options, X-Content-Type-Options, Referrer-Policy, Permissions-Policy в ответе сайта, ставит оценку A–F…
Chrome: Сторонние скрипты — Показывает, к каким внешним сервисам подключается сайт и куда отправляет данные: аналитика, реклама, соцсети, чаты, мониторинг ошибок и др.
Chrome: Кнопка копирования кода — При наведении на блок кода на любом сайте появляется кнопка «Копировать». Убирает номера строк и знак $.
Chrome: Генератор картинок-заглушек — Мгновенно создавайте картинку-заглушку нужного размера, цвета и с текстом: PNG, JPG, WebP или SVG; скачать, скопировать или data URL.
Chrome: Генератор Mock API — Работайте над фронтендом без готового бэкенда: опишите endpoint и шаблон — расширение перехватит fetch/XHR и вернёт фейковые данные.

Браузер может спросить разрешение на несколько загрузок.

Как установить расширение

Скачайте zip со страницы расширения и распакуйте в постоянную папку.
Откройте chrome://extensions и включите «Режим разработчика».
Нажмите «Загрузить распакованное» и выберите папку.