Breakpoint Viewer

Узнайте, какой CSS-брейкпоинт активен на любом сайте. В углу страницы появляется небольшой бейдж с названием текущего брейкпоинта, его минимальной шириной и фактической шириной вьюпорта в пикселях. Бейдж обновляется мгновенно при изменении размера окна браузера.

Как это работает

Установите расширение и откройте любой сайт. В углу страницы появится небольшой бейдж. При изменении размера окна он обновляется в реальном времени, показывая активный в данный момент брейкпоинт. Выберите один из готовых пресетов для вашего CSS-фреймворка или настройте собственные брейкпоинты.

Возможности

• Отображает активный CSS-брейкпоинт, его минимальную ширину и текущую ширину вьюпорта
• Готовые пресеты для Tailwind CSS, Bootstrap, Bulma и Foundation
• Пользовательские брейкпоинты с полным контролем над названиями, значениями ширины и цветами
• Размещение бейджа в любом углу страницы
• Список разрешённых и заблокированных сайтов для управления отображением бейджа на конкретных ресурсах
• Обновление в реальном времени при изменении размера окна
• Лёгкое расширение, которое не влияет на содержимое страницы
• Работает на любом сайте

Для кого это расширение

Для фронтенд-разработчиков и дизайнеров, которые создают или тестируют адаптивные сайты. Вместо того чтобы гадать или вручную проверять CSS, вы получаете нужную информацию прямо на странице и сразу видите всё необходимое.

Зачем его устанавливать

Лёгкое, быстрое и ненавязчивое. Не требует аккаунта, никакие данные не покидают ваш браузер.