Конвертер HTML в изображение
Вставьте фрагмент HTML. Скрипты, формы, фреймы и обработчики событий удаляются перед отрисовкой.
HTML и созданное изображение остаются в этом браузере. Удалённые изображения, шрифты и таблицы стилей загружаются с исходных адресов. Для полностью автономной отрисовки встраивайте данные в код.
Преобразуйте фрагмент HTML и CSS в PNG или JPG фиксированного размера, не отправляя исходный код или изображение в Hyperion. Задайте от 64 до 1 920 px на сторону и масштаб от 1x до 3x, затем просмотрите и скачайте результат в браузере.
Как отрисовать HTML в виде изображения
-
1
Вставьте код
Введите фрагмент или документ HTML. Встроенный CSS и правила `<style>` поддерживаются; скрипты, формы, фреймы и обработчики событий удаляются.
-
2
Настройте холст
Выберите PNG или JPG, задайте ширину, высоту и масштаб от 1x до 3x.
-
3
Создайте предпросмотр
Браузер размещает очищенный код в изолированной рамке фиксированного размера.
-
4
Скачайте локально
Сохраните PNG или JPG напрямую. Созданный файл не отправляется в Hyperion.
Что поддерживает браузерная отрисовка
Конвертер использует механизм макета браузера. В результат могут попасть обычный HTML, встроенный CSS, правила <style>, Flexbox, Grid, градиенты, тени, встроенный SVG и установленные шрифты. Создаётся неподвижное растровое изображение, а не интерактивная копия страницы.
Правила холста и файла
| Настройка | Допустимый диапазон | Поведение |
|---|---|---|
| Ширина | От 64 до 1 920 px | Точная CSS-ширина рамки |
| Высота | От 64 до 1 920 px | Точная CSS-высота; лишнее содержимое обрезается |
| Масштаб | От 1x до 3x | Повышает разрешение, не меняя макет |
| PNG | Растр фиксированного размера | Сохраняет прозрачные области |
| JPG | Растр фиксированного размера | Использует качество 92% и белый фон |
Выход ограничен 16 мегапикселями для защиты памяти браузера. Если размеры и масштаб превышают предел, инструмент снижает масштаб до наибольшего безопасного шага 0,5x. В исходном HTML допускается не более 100 000 символов.
Конфиденциальность и внешние ресурсы
HTML и созданное изображение данных остаются в текущем браузере. В пошаговом режиме хранилище сеанса этой вкладки сохраняет настройки до следующего этапа, а запуск заново удаляет их. Инструмент не отправляет код или изображение в Hyperion.
Внешний URL является исключением. Изображения, веб-шрифты и таблицы стилей запрашиваются с исходных серверов, которые видят запрос. CORS или защита доступа также могут помешать загрузке. Для полностью автономной работы встраивайте изображения и шрифты как URL данных, а CSS размещайте в коде.
Ограничения безопасности и точности
Перед захватом удаляются скрипты, формы, вложенные фреймы, объекты и атрибуты событий. Предпросмотр становится неинтерактивным, но такая обработка не заменяет полноценную очистку HTML для последующей публикации. Виджеты JavaScript не запускаются, состояние видео и canvas не гарантируется, анимация превращается в один кадр, а CSS для конкретного браузера может отличаться в другом движке.
Часто задаваемые вопросы
Да. Средство отрисовки берёт поддерживаемые правила <style> и ссылки на таблицы стилей из head, затем захватывает содержимое body. Скрипты, метаданные, формы, фреймы и активные обработчики удаляются, поэтому результат не является страницей для навигации.
Исходный сервер может блокировать междоменное использование, требовать входа или отвечать слишком медленно. Используйте доступный адрес с поддержкой CORS или встройте ресурс как URL данных.
PNG сохраняет прозрачные пиксели. JPG использует белый фон и фиксированное качество 92%, что часто уменьшает фотографии. Инструмент не экспортирует WebP и не даёт отдельной настройки качества.
Конвертер ограничивает выход 16 мегапикселями. Для большого холста он автоматически выбирает наибольший безопасный шаг 0,5x, чтобы не исчерпать память браузера.
Сопутствующие инструменты
Справочная таблица ASCII
Полная таблица ASCII от 0 до 127 с десятичным, шестнадцатеричным, восьмеричным и двоичным представлением, а также записью числовых ссылок HTML, включая NUL, LF и DEL.
Справочник символов HTML
Справочник HTML-сущностей с поиском, их именованными и числовыми кодами, а также копированием специальных символов и знаков одним кликом.
Генератор цветовой палитры
Создавайте монохромные, аналоговые, комплементарные, триадные или тетрадные палитры из базового HEX-цвета и экспортируйте готовые CSS-переменные.
Генератор случайных букв
Генерируйте случайные буквы A-Z. Выберите количество, верхний или нижний регистр либо смешанный вариант для игр, заданий и уроков.
Счетчик FPS
Измерьте FPS браузера через requestAnimationFrame: сглаживание, минимальная и максимальная частота кадров, порог предупреждения и график по желанию. Работает локально, без загрузок и API.
Генератор случайных цветовых палитр
Создавайте случайные палитры из 2–15 цветов, выбирайте яркий, пастельный, приглушенный или темный стиль и копируйте HEX-коды или CSS-переменные.