HTML в PDF онлайн — вставьте код и сохраните PDF
Превращает HTML-код в PDF с выбранным форматом бумаги и полями
Работает в браузере · файлы никуда не загружаются
Вставьте фрагмент (<div>…) или целый документ (<html>…). Из целого документа берутся только содержимое <body> и блоки <style>.
Дополнительные стили. Правила @media print тоже применяются.
Ради безопасности и конфиденциальности изображения, шрифты и CSS не с адресами data: или blob: никогда не запрашиваются, а скрипты не выполняются. Преобразование веб-страницы по её URL не предусмотрено.
Предпросмотр (ширина области печати)
Введите HTML, чтобы увидеть предпросмотр.
В окне печати выберите принтер «Сохранить как PDF». В PDF останется настоящий текст, по которому можно искать; разбиение на страницы выполняет браузер.
Нарезает предпросмотр на картинки размером со страницу. Скачивается сразу, без диалога, но текст нельзя искать и копировать, а страница может разорваться посреди строки.
Что делает инструмент
Коммерческие предложения, квитанции и шаблоны писем часто сделаны на HTML. Вставьте сюда HTML и CSS, посмотрите предпросмотр в ширину области печати выбранной бумаги и сохраните PDF одним из двух способов: через окно печати — PDF с текстом, или сразу скачайте PDF из изображений. Код остаётся на этой странице, на сервер ничего не отправляется.
Как пользоваться
- Вставьте HTML. Из целого документа (
<html>…) берутся только содержимое<body>и блоки<style>. При желании добавьте CSS во второе поле. - Выберите бумагу (A4, Letter, A3), ориентацию и поля, а также печатать ли фон.
- Проверьте предпросмотр и нажмите Сохранить в PDF через окно печати, затем выберите принтер «Сохранить как PDF».
- Или нажмите Скачать PDF из изображений, чтобы получить PDF из картинок страниц.
Как это работает
- Очистка: код разбирается DOMParser (инертный документ) и CSS-парсером браузера; удаляются все адреса, кроме data: и blob: (изображения, @import, url(), srcset), элементы script, iframe, object и link, а также атрибуты on*. Удалённые адреса показываются списком.
- Фрейм предпросмотра: изолированный iframe (sandbox) без права на скрипты и с Content-Security-Policy, которая блокирует запросы и скрипты.
- Шрифты: используются шрифты, установленные на устройстве, поэтому кириллица и любые другие алфавиты выходят так, как их показывает браузер.
- Бумага: A4 210×297 мм и A3 297×420 мм (ISO 216), Letter 8,5×11 дюймов; в режиме печати формат и поля задаются через CSS
@page. - PDF из изображений: содержимое, свёрстанное в ширину области печати (680 px для A4 с полями 15 мм), снимается постранично с масштабом 2× и сохраняется в JPEG, до 50 страниц, с помощью html-to-image (MIT) и pdf-lib (MIT).
- Длина: до 500 000 символов в HTML и CSS вместе.
Примеры
| Цель | Действия |
|---|---|
| Коммерческое предложение в PDF с поиском по тексту | Вставить пример → A4, обычные поля → окно печати → Сохранить как PDF |
| Получить файл сразу на телефоне | Скачать PDF из изображений |
| Широкая таблица | Альбомная, узкие поля |
Чтобы сохранить HTML как картинку PNG, воспользуйтесь инструментом «HTML в изображение»; чтобы посмотреть Markdown на экране — предпросмотром Markdown.
Частые вопросы
Можно преобразовать веб-страницу по её URL?
Нет. Преобразуется только вставленный HTML. Загрузка чужого сайта от вашего имени означала бы запросы к нему с вашего устройства, возможно с вашей авторизацией. Чтобы сохранить веб-страницу, откройте её и воспользуйтесь в браузере пунктом «Печать → Сохранить как PDF».
Чем отличаются две кнопки?
«Сохранить в PDF через окно печати» использует печать самого браузера: по тексту можно искать, а разрывы страниц приходятся между строками. «Скачать PDF из изображений» обходится без диалога, но сохраняет каждую страницу картинкой: текст нельзя выделить, и страница может разорваться посреди строки.
Кириллица отображается правильно?
Да. Предпросмотр и PDF рисует браузер шрифтами, установленными на устройстве, поэтому русский текст и другие алфавиты выглядят так же, как в браузере.
Почему пропали мои изображения или веб-шрифты?
Ради безопасности и конфиденциальности изображения, шрифты и таблицы стилей не с адресами data: или blob: никогда не запрашиваются. Встраивайте изображения как data: URL в Base64; текст использует шрифты, установленные на устройстве.
Что происходит со скриптами?
Элементы script и атрибуты событий вроде onclick удаляются, а у фрейма предпросмотра есть политика, блокирующая скрипты, так что ничего из вставленного кода не выполняется.
Можно управлять разрывами страниц?
В режиме печати учитываются правила CSS вроде `break-before: page`, а правила `@media print` из поля CSS применяются только при печати.
