Установка · Съёмка · Аннотации · Экспорт
Документация
Как установить и использовать OpenScreenShot — расширение Chrome с открытым кодом для скриншотов и аннотаций.
Установка
OpenScreenShot доступен в Chrome Web Store.
- Откройте страницу OpenScreenShot в Chrome.
- Нажмите Добавить в Chrome.
- Примите разрешения. Расширению нужна активная вкладка и разрешение запускать в ней свой скрипт съёмки.
- Значок OpenScreenShot появится на панели инструментов. Нажмите его, чтобы открыть окно расширения.
Снять скриншот
Нажмите на значок OpenScreenShot на панели инструментов — захват всей страницы начнётся сразу, без меню. Всё выполняется локально в браузере. Начать захват можно четырьмя способами:
- Значок на панели инструментов — один клик снимает всю страницу. Отключите Режим Express в один клик в настройках, чтобы вернуть выбор режима; правый клик по значку открывает остальные режимы и настройки.
- Сочетание клавиш — Ctrl+Shift+S для всей страницы, Alt+Shift+V для видимой части, Ctrl+Shift+E для области. На macOS это ⌘⇧S, ⌥⇧V и ⌘⇧E. У снимка элемента нет клавиши по умолчанию. Задать или изменить любое сочетание можно на
chrome://extensions/shortcuts. - Контекстное меню — подменю OpenScreenShot на любой странице предлагает те же четыре режима и настройки.
- Повторить область — нижняя часть окна расширения и меню правой кнопки повторяют съёмку последней области. Оба пункта появляются после того, как вы хоть раз выделили область.
Строка Задержка в окне расширения откладывает съёмку на 3, 5 или 10 секунд, а значок на панели инструментов ведёт обратный отсчёт. Используйте её для состояний наведения, выпадающих меню и подсказок, которые закрываются от клика в другом месте.
Режимы съёмки
Вся страница
Снимает всю прокручиваемую страницу и склеивает её в одно изображение. Расширение прокручивает страницу экран за экраном, снимает каждую плитку и собирает их вместе. Закреплённые шапки снимаются на первой плитке и один раз подставляются сверху. Страницы, где прокручивается внутренний элемент, а не окно, тоже работают. Страница выше одного изображения (32 000 физических пикселей) сохраняется как максимум шесть изображений: «Скачать» даёт имя каждой части, а «Редактор» или «Буфер обмена» открывает каждую часть в отдельной вкладке редактора.
Видимая часть
Мгновенно снимает текущую видимую часть. Без прокрутки. Подходит для быстрого скриншота того, что на экране прямо сейчас.
Выделенная область
Нажмите и потяните, чтобы нарисовать прямоугольник. На каждой стороне и в углах появляются маркеры для изменения размера. Стрелками двигайте выделение по одному пикселю; с зажатым Shift — по десять. Enter подтверждает, Esc отменяет.
Элемент
Наведите курсор на страницу, чтобы выбрать карточку, график, таблицу, изображение или другой элемент, затем кликните или нажмите Enter, чтобы снять ровно его границы. ↑ выбирает родительский элемент, ↓ — дочерний, ←/→ — соседние. Если элемент виден не полностью, выбор предлагает вместо этого снимок всей страницы.
После съёмки
Строка После съёмки в окне расширения задаёт, что происходит с готовым снимком. Она действует для всех способов запуска: кнопок в окне, сочетаний клавиш и меню правой кнопки.
- Редактор — открыть редактор аннотаций в новой вкладке. Это вариант по умолчанию.
- Буфер обмена — скопировать скриншот и пропустить редактор. Вставляйте его сразу в чат, документ или issue.
- Скачать — сохранить скриншот в папку загрузок и пропустить редактор. Быстрые сохранения пишутся в PNG.
Буфер обмена и скачивание не открывают вкладку, поэтому подтверждением служит значок на панели инструментов. При неудачной съёмке на значке мигает !. Кнопка Прошлый снимок внизу окна расширения в любой момент открывает последний снимок в редакторе.
Аннотации
Редактор открывается в отдельной вкладке и загружает последний снимок из локального хранилища. У каждого инструмента есть однобуквенная клавиша.
- Выбор V — переместить, изменить размер или удалить любую аннотацию. Двойной клик по текстовому слою открывает его на правку.
- Фигура R — нарисовать прямоугольник, скруглённый прямоугольник, овал или треугольник. Заливка задаёт отсутствие заливки или сплошную заливку цветом штриха; зажмите Shift для равных сторон — так овал становится кругом.
- Стрелка A — нарисовать направленную стрелку с закрашенным, открытым, двойным наконечником или точкой. Потяните круглый средний маркер, чтобы изогнуть её в кривую.
- Линия L — стрелка без наконечника.
- Перо P — рисование от руки.
- Маркер H — полупрозрачный штрих от руки.
- Текст T — добавить текстовый блок; размер задаёт настройка кегля.
- Номер шага S — нумерованные значки, которые считают сами и перенумеровываются при удалении одного из них.
- Размытие B — скрыть чувствительное содержимое мягким размытием, крупной мозаикой или сплошной заливкой. Заливка переживает пересжатие.
- Spotlight O — вырезы в форме прямоугольника, скруглённого прямоугольника или эллипса, которые сливаются в один затемняющий слой.
- Пипетка I — взять цвет со снимка. Она берёт то, что вы видите, поэтому цвет внутри spotlight или на градиенте Beautify выбирается таким, каким выглядит. Кнопка-образец на строке цветов открывает общесистемную пипетку Chrome для всего за пределами холста.
- Обрезка C — обрезать изображение по выделенной области.
- Cut X — отметить горизонтальные полосы на длинном снимке и удалить их, с живым предпросмотром.
Зажмите Shift во время рисования для фигур с равными сторонами и линий и стрелок под 45°. Панель стилей содержит палитру из 8 цветов на клавишах 1–8, свой цвет, недавние цвета, четыре толщины штриха, которые масштабируются с размером снимка, и настройку кегля. Ваш выбор запоминается между сеансами. Перетаскивайте инструменты на панели, чтобы поставить любимые первыми, или перемещайте выбранный инструмент клавишами Alt+↑ / Alt+↓. Отмена и повтор — Ctrl+Z / Ctrl+Shift+Z, на macOS — ⌘Z / ⌘⇧Z.
Beautify
Панель Beautify в верхней панели оформляет скриншот для отправки: Вид, ползунки Отступы, Углы и Тень и Фон из шести градиентов, своего сплошного цвета или прозрачности. Рамка показывается вживую и попадает в каждый экспорт, в буфер обмена и в PDF.
Аннотировать готовое изображение
Перетащите файл изображения на холст редактора или вставьте его через Ctrl+V / ⌘V вне текстового поля. Импорт занимает то же место, что и снимок, поэтому все инструменты, рамка Beautify и все пути экспорта продолжают работать, а верхняя панель показывает Imported. Импорт заменяет холст, поэтому редактор сначала спросит, если есть аннотации, которые можно потерять.
Экспорт
Нажмите Сохранить изображение в верхней панели редактора или Ctrl+S / ⌘S, чтобы открыть диалог Экспорт. Рядом Копировать кладёт PNG в буфер обмена, а PDF сохраняет PDF в один клик. В диалоге выберите формат:
- PNG — без потерь, сохраняет прозрачность.
- JPEG — файлы меньше, качество настраивается.
- WebP — настраиваемое качество как у JPEG, прозрачность как у PNG.
- PDF — экспорт одной страницей-изображением, по размеру A4/Letter, или разбивка на несколько страниц с перекрытием 5 мм, чтобы содержимое не резалось посреди строки.
Масштаб экспортирует в 25, 50, 100 или 200 % либо в точную ширину в пикселях. Для PDF он скрыт — тот подгоняется под страницу. Размер сверх лимита холста Chrome отклоняется, а не записывается пустым файлом.
Ctrl+C / ⌘C копирует готовое изображение прямо в буфер обмена. Диалог экспорта также может сохранить текущие настройки как новые значения по умолчанию.
Записать вкладку
Запись вкладок доступна в версии для Chrome; версия для Firefox пока поддерживает только скриншоты. Нажмите Запись во всплывающем окне, чтобы открыть вкладку записи рядом со страницей. Во время записи нажмите Alt+Shift+X, чтобы остановить её с любой вкладки. При первой записи Chrome один раз запросит разрешение на захват вкладки.
Начать запись
Вкладка записи показывает изображение страницы и живую картинку с камеры. Включите там Микрофон, Звук или Камера; запрос разрешения браузера появится на этой вкладке. Проведите по изображению, чтобы записать только часть страницы, или оставьте Вся вкладка. Нажмите Начать запись, и OpenScreenShot переключится на вашу страницу.
Если во время записи вкладка переходит на другой сайт, отслеживанию кликов нужно необязательное разрешение «Запись на всех сайтах» (см. Настройки), чтобы следовать за ней. Без него значок на панели инструментов становится янтарным, а масштабирование и эффекты кликов пропадают в остальной части видео. Само видео продолжает записываться.
Вкладка записи
Во время записи на вкладке записи есть таймер и кнопки «Пауза/Продолжить», «Стоп» и «Отмена». На записываемую страницу ничего не добавляется, поэтому в видео нет элементов управления. Чтобы остановить запись, вернитесь на вкладку или нажмите Alt+Shift+X. После остановки та же вкладка открывает редактор.
Веб-камера попадает в экспорт как круглый пузырь, который вы размещаете в редакторе, а редактор обрезает видео до выбранной области.
Редактор
«Стоп» открывает редактор записи со шкалой времени вашего дубля. Редактор добавляет плавный зум 2x на каждый клик курсора — подстройте или удалите любой из них либо добавьте собственные блоки зума на 1,5x, 2x или 3x. Обрежьте начало или конец любого сегмента, потянув его маркеры. Эффекты кликов отмечают места нажатий, а окно камеры, рамка Beautify и ползунки громкости микрофона и вкладки находятся в боковой панели. «Показывать курсор» рисует плавный указатель по записанной траектории курсора; выключается в панели настроек.
Экспорт
Экспорт перерисовывает дубль через canvas, подмешивая выбранные дорожки и эффекты, и по умолчанию скачивает файл MP4 (H.264 и AAC) или WebM, если выбрать его в списке рядом с кнопкой. MP4 ограничен размером 4096×2304, поэтому более крупная вкладка уменьшается под этот размер. Браузеры без записи MP4 экспортируют только WebM.
Черновики
Правки сохраняются локально по мере работы. Если вкладка редактора закроется или упадёт, следующая вкладка предложит вернуть черновик. Восстановление всегда по клику, поэтому устаревший черновик никогда не заменит снимок, который вы хотели начать с чистого листа. Обрезанное изображение получает собственный черновик, поэтому аннотации никогда не восстановятся поверх не той картинки.
Сочетания клавиш
Нажмите ? в редакторе, чтобы увидеть полный список. Помимо буквенных клавиш инструментов выше:
- 1–8 — задать цвет аннотации.
- Ctrl+C / ⌘C — копировать в буфер обмена.
- Ctrl+S / ⌘S — экспорт.
- Backspace — удалить выбранную аннотацию.
- Esc — снять выделение или отменить обрезку.
- Ctrl / ⌘ с +, − или 0 — увеличить, уменьшить, реальный размер. F вписывает в экран.
- Space + перетаскивание — панорамировать холст.
Alt+Shift+X останавливает текущую запись откуда угодно — открытые редактор или окно расширения не нужны.
Настройки
Откройте значок шестерёнки в окне расширения, чтобы задать:
- Тема — светлая, тёмная или системная.
- Формат — PNG, JPEG, WebP или PDF.
- Качество — для JPEG, WebP и PDF.
- Шаблон имени файла — нажмите на метку токена, чтобы вставить
{date},{time},{title},{domain},{w}или{h}. Живой предпросмотр показывает результат. Добавьте/, чтобы сохранять в папку внутри «Загрузок», напримерScreenshots/{title}.
Настройки хранятся в локальном хранилище на этом устройстве. Сбросить настройки внизу панели требует двух нажатий.
Запись на всех сайтах — по умолчанию выключено. При включении запрашивается необязательное разрешение на хост <all_urls>, чтобы отслеживание кликов могло следовать за вкладкой, которая во время записи переходит на новый сайт.
Агенты и CLI
openscreenshot (npm) — отдельный необязательный локальный инструмент, чтобы снимать скриншоты скриптами из командной строки или из ИИ-агента. Он управляет Chrome, который уже установлен на вашем компьютере, — без загрузки браузера и без облачного сервиса. Задайте CHROME_PATH, если ваш Chrome не находится автоматически.
pnpm dlx openscreenshot shot https://example.com --out shot.png --full
Чтобы использовать его как MCP-сервер, добавьте в конфигурацию своего MCP-клиента:
{ "command": "pnpm", "args": ["dlx", "openscreenshot"] }
Затем вызовите инструмент capture_screenshot с { "url": "https://example.com" }. Необязательные входные данные: fullPage (по умолчанию false), width (200–3840, по умолчанию 1280), height (200–2160, по умолчанию 800) и redact, который до съёмки закрывает чёрными прямоугольниками элементы по CSS-селекторам selectors, текст по шаблонам patterns (email, phone, secret) и прямоугольники в пикселях rects. Инструмент возвращает изображение PNG вашему клиенту. Клиент, который использует размещённую модель, может отправить это изображение своему поставщику; используйте redact для данных, которые не должны покидать устройство, и проверьте настройки данных клиента.
Конфиденциальность
OpenScreenShot обрабатывает всё локально в вашем браузере. Снимки хранятся в локальном хранилище Chrome и не загружаются ни на какой сервер. Записи, дорожки курсора и потоки микрофона и камеры остаются в IndexedDB на вашем устройстве, пока вы их не удалите. В расширении нет аналитики, телеметрии и сторонних сервисов.
Все подробности — в политике конфиденциальности.
Получить помощь
Частые вопросы и известные ограничения — на странице поддержки и FAQ. Если нужна ещё помощь, откройте issue на GitHub.
Установите OpenScreenShot
Бесплатно, с открытым кодом и приватно. Доступно в Chrome Web Store.