Макет браузера

Генератор макетов браузера

Оберните скриншот сайта в чистое окно браузера — с панелью вкладок, адресной строкой и всем остальным — и скачайте, бесплатно прямо в браузере.

Перетащите скриншот для оформления

Перетащите, вставьте или выберите файл

PNG · JPG · WebP — создаётся на вашем устройстве

Окно браузераАдресная строкаБез водяного знака Phone · Laptop · Browser

Обрамите сайт в окно браузера

Скриншот сайта в рамке окна браузера выглядит гораздо убедительнее. Панель вкладок с кнопками управления и адресная строка мгновенно сигнализируют: «это настоящий сайт» — идеально для портфолио, кейсов, лендингов и документации.

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

Как создать макет браузера

  1. Откройте скриншот сайта. Горизонтальный скриншот страницы лучше всего подходит для рамки браузера.
  2. Выберите рамку Браузер. Вокруг скриншота появятся панель вкладок, кнопки управления и адресная строка.
  3. Оформите. Добавьте градиент или цветной фон, затем отрегулируйте отступы, тень и наклон.
  4. Скачайте. Сохраните PNG, JPG или WebP в высоком разрешении.

Снимайте на полную ширину страницы

Делайте скриншот при типичной ширине рабочего стола (около 1280–1440px), чтобы пропорции соответствовали реальному браузеру. Если скриншот уже включает хром браузера, предварительно обрежьте его до содержимого страницы, чтобы избежать дублирования.

More mockup & screenshot tools

Часто задаваемые вопросы

В рамке браузера есть адресная строка?

Да — рамка браузера содержит панель вкладок с кнопками управления и адресную строку, нарисованные как чистый векторный хром.

Можно изменить текст адресной строки?

Адресная строка — нейтральная таблетка без редактируемого текста в этой версии. При необходимости можно добавить текстовую аннотацию поверх неё.

Какая ориентация скриншота лучше?

Горизонтальный (широкий) скриншот веб-страницы наиболее органично вписывается в рамку браузера.

Где обрабатывается моё изображение?

Макет собирается в браузере, поэтому новое изображение создаётся на вашем устройстве. Порядок обработки данных, связанных с инструментом, описан в нашей политике конфиденциальности.

Другие инструменты для изображений