Конвертировать Markdown в HTML
Превратите Markdown в аккуратную самостоятельную веб-страницу или в чистый HTML для вставки в блог или CMS — с таблицами в стиле GitHub, подсветкой кода и заголовками, на которые можно ссылаться.
- Не сохраняется
- Без очереди и ожидания
- Без регистрации и водяных знаков
Нет файла под рукой?
Как это работает
Добавьте Markdown
Перетащите файл .md или пишите и вставляйте текст прямо в редактор.
Выберите результат
Полная оформленная страница, которая откроется где угодно, или только HTML для вашего сайта.
Скопируйте или скачайте
Скопируйте HTML в буфер обмена или сохраните его как файл .html.
Фрагмент или страница — и что из этого нужно вам
Полезных вариантов результата два, и они не взаимозаменяемы. Фрагмент — это только сконвертированная разметка: заголовки, абзацы, списки, ссылки — без обёртки документа. Он нужен, когда результат пойдёт в шаблон, в поле CMS или на другую страницу. Полная страница добавляет doctype, head, объявление кодировки и таблицу стилей, поэтому открывается сама по себе и выглядит достойно. Если вставить полную страницу в CMS, получится документ внутри документа; если открыть фрагмент в браузере — текст без оформления.
Конвертация охватывает общепринятый расширенный набор Markdown: заголовки, выделение, списки, ссылки, изображения, цитаты, таблицы, блоки кода с подсветкой синтаксиса, списки задач, зачёркивание и сноски. Заголовки получают идентификаторы на основе своего текста, поэтому на них можно ссылаться напрямую — именно такие якорные ссылки делают длинную документацию удобной.
Сырой HTML внутри Markdown передаётся как есть — так предписывает спецификация, и к этому стоит относиться осознанно: Markdown-файл из ненадёжного источника может содержать тег script, и после конвертации страница будет нести этот скрипт. Никогда не отображайте Markdown от посторонних, не очистив потом HTML: конвертация — не барьер безопасности и никогда им не задумывалась.
Две вещи намеренно выводятся блоками кода, а не отрисовываются. Математическим формулам в нотации LaTeX нужна библиотека вёрстки, а диаграммам Mermaid — отрисовщик диаграмм; каждая из них — серьёзная зависимость, а неверно отрисованная формула хуже, чем просто видимый исходный код. Полная страница использует обычные системные шрифты, ничего не загружая, поэтому работает офлайн и немного по-разному выглядит в Windows, macOS и Linux.
Если нужно другое
Pandoc умеет то, что здесь не реализовано, и многое другое: pandoc in.md -o out.html --mathjax --standalone --toc правильно отрисовывает формулы, создаёт оглавление и принимает шаблон, чтобы результат совпадал с оформлением вашего сайта. Он также конвертирует в сорок с лишним других форматов и обратно — поэтому его стоит один раз установить.
Если нужен сайт, а не файл, используйте генератор, а не конвертируйте страницы по одной. Hugo, Eleventy, Jekyll и MkDocs превращают папку с Markdown в сайт с навигацией, поиском и единым оформлением и пересобирают его при каждом изменении исходников — а это и есть настоящая задача, как только документов больше одного.
Частые вопросы
Полная страница или фрагмент HTML — что мне нужно?
Полная страница — это один файл .html со своими стилями: он хорошо выглядит, если открыть его с рабочего стола, на телефоне или в распечатке. Фрагмент — только разметка содержимого, без стилей, для вставки в WordPress, Ghost, CMS или ваш собственный шаблон.
Какие возможности Markdown поддерживаются?
Markdown в варианте GitHub: таблицы с выравниванием, списки задач, зачёркивание, автоссылки, блоки кода с подсветкой синтаксиса, сноски и встроенный HTML. Заголовки получают id в стиле GitHub, поэтому ссылки вроде #installation продолжают работать.
Мой текст где-нибудь сохраняется?
Нет. Ничего никуда не отправляется и ничего не сохраняется.
Что происходит с изображениями?
Пути к изображениям остаются точно такими, как вы их написали, поэтому страница работает, если сохранить её рядом с папкой изображений. Перетащите сюда и сами изображения — они встроятся в файл, и он будет работать сам по себе.
Безопасно ли публиковать такой HTML?
Из любого HTML внутри вашего Markdown удаляются скрипты, формы, встроенные фреймы и встроенные обработчики событий, поэтому в результате остаётся только форматирование.
Можно ли добавить оглавление?
Да — отметьте «Оглавление» или поставьте [TOC] отдельной строкой там, где должен быть список.
Полезно знать: Математические формулы и диаграммы Mermaid выводятся как блоки кода, а не отрисовываются. Полная страница использует безопасные системные шрифты, поэтому в Windows, macOS и Linux выглядит немного по-разному.
Разместите этот инструмент на своём сайте
Бесплатно для любого блога, страницы класса или справочной статьи. Вставьте один фрагмент кода — и посетители смогут пользоваться инструментом прямо на вашей странице.