Перейти к содержимому

Конвертировать Markdown в HTML

Превратите Markdown в аккуратную самостоятельную веб-страницу или в чистый HTML для вставки в блог или CMS — с таблицами в стиле GitHub, подсветкой кода и заголовками, на которые можно ссылаться.

  • Не сохраняется
  • Без очереди и ожидания
  • Без регистрации и водяных знаков

Нет файла под рукой?

Как это работает

1

Добавьте Markdown

Перетащите файл .md или пишите и вставляйте текст прямо в редактор.

2

Выберите результат

Полная оформленная страница, которая откроется где угодно, или только HTML для вашего сайта.

3

Скопируйте или скачайте

Скопируйте 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 выглядит немного по-разному.

Разместите этот инструмент на своём сайте

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