← К публикациям

Инструменты

Markdown в терминале: 14 просмотрщиков с Mermaid и без

· 14 минут чтения

Окно терминала, в котором строки Markdown превращаются в разветвлённую схему с коралловым узлом

Читать README.md и заметки прямо в терминале удобно, пока работаешь в репозитории или по SSH. Сам Markdown приятнее читать в отрендеренном виде, особенно документы с таблицами. Цель этого исследования — найти лучший просмотрщик Markdown для терминала, желательно с поддержкой Mermaid. Я взял Frogmouth как отправную точку, изучил документацию 13 альтернатив и проверил все 14 программ на документах с одинаковыми блоками. Терминальные режимы сняты в Ghostty, а mdv дополнительно проверен в GUI, который запускается из CLI. Ниже видно не только результат рендера Mermaid, но и часть полезных режимов чтения; графики других форматов и отдельные изображения я систематически не тестировал.

Мой топ-3 для Mermaid в терминале по этим снимкам: Markless — обе схемы и навигация; markdown-reader — чтение целого репозитория; glowm — графические схемы, но нужен Chrome или Chromium. mdv — отдельный удачный GUI, запускаемый из CLI. Frogmouth остаётся моим любимым просмотрщиком обычного Markdown, хотя Mermaid пока показывает кодом.

Что считать поддержкой Mermaid

Mermaid — текстовый язык для схем: блок с пометкой mermaid описывает узлы и связи, а просмотрщик решает, как их показать. В терминале встречаются три разных результата:

Фрагмент README.md

## Как показать документ

```mermaid
flowchart LR
  A["Markdown-файл"] --> B{"Mermaid?"}
  B -->|да| C["Показать схему"]
  B -->|нет| D["Показать код"]
```

Та же схема после рендера

Markdown-файл ведёт к проверке Mermaid: «да» — показать схему, «нет» — показать код
Слева настоящий Markdown-фрагмент с блоком mermaid, справа схема из него. Это иллюстрация, а не снимок просмотрщика. Синтаксис flowchart.
  1. Символьная схема. Линии и блоки нарисованы знаками терминала. Она работает в SSH и мультиплексорах без протокола картинок, но сложная схема может быть упрощена.
  2. Изображение внутри терминала. Схема похожа на привычный рендер Mermaid. Нужна поддержка Kitty, iTerm2 или Sixel либо символьный запасной режим. Внешний mermaid-cli может потребовать Chromium.
  3. Исходный код. Просмотрщик знает про блок Mermaid, но показывает его текст. Для задачи «читать схемы» этого недостаточно.

Разница важна даже для одного инструмента: в обычном терминале он может показывать картинку, а внутри tmux — код. Поэтому «поддерживает Mermaid» ещё не означает, что схему увидите в своём окружении.

Скриншоты и режимы

Размеры ниже — ориентиры для macOS: размер исполняемого файла либо Python-окружения с зависимостями.

Метка Mermaid отмечает программы, у которых в проверенном режиме обе тестовые схемы — flowchart и sequenceDiagram — получились читаемыми с подписями. У mdv это относится к GUI. Другие типы схем этой меткой не оценены.

Markdown и Mermaid внутри cmux

В cmux есть встроенный просмотрщик Markdown для тех, кто уже работает в его терминале. В установленной версии 0.64.22 команда открывает файл в панели рядом с терминалом:

cmux markdown open README.md
В cmux слева открыт исходный Markdown с двумя блоками Mermaid, справа видны обе отрендеренные схемы с подписями
Тестовый mermaid.md в cmux: исходник слева, две схемы справа.

Панель обновляется после изменения файла. Markdown отображается в WKWebView: marked разбирает текст, highlight.js подсвечивает код, github-markdown-css оформляет документ, а Mermaid.js рисует блоки с пометкой mermaid. Все эти компоненты включены в cmux, поэтому для просмотра не нужен CDN. Схемы выводятся в графической панели рядом с терминалом и не зависят от протокола показа изображений в терминальном потоке. Панель cmux вынесена за рамки рейтинга 14 самостоятельных программ.

Как сняты кадры

Для 13 программ использованы два одинаковых синтетических файла: первый с заголовками, таблицей и ссылкой, второй с flowchart и sequenceDiagram. Для дополнительных кадров сделаны документ с оглавлением, задачами и GFM-примечанием и файл с тремя слайдами. Терминальные снимки сделаны в активном окне Ghostty 1.3.1 с Hack Nerd Font Mono 23,5 pt, без tmux; фактическая сетка — 123 × 35 ячеек. Перед запуском каждой программы я дождался полного размера окна и снял переменную NO_COLOR. GUI-кадры mdv сняты в отдельном окне приложения, запущенного из CLI. На них окно сохранено целиком, включая заголовок и нижнюю строку; удалён только фон за скруглёнными углами. Нажмите на кадр для полного размера.

Скачать файлы для повторения: demo.md — Markdown с таблицей, mermaid.md — две схемы, guide.md — локальная ссылка из первого файла.

SSH, tmux и Zellij

При работе по SSH символьные схемы остаются обычным текстом. Для Mermaid-картинки нужна поддержка на всём пути от просмотрщика до локального терминала. Протокол Kitty допускает передачу изображения с удалённой машины прямо в потоке терминала; ссылка на файл на удалённом диске локальному терминалу не поможет.

Мультиплексор добавляет ещё одно звено. tmux может отбрасывать незнакомые графические последовательности; для его режима passthrough нужна настройка allow-passthrough, а программе — соответствующий способ передачи. Это не гарантия работы любой схемы. В нашем раннем тесте mdfried внутри tmux в Terminal.app перешёл к символьному выводу через chafa; прямой запуск в Ghostty 1.3.1 показал картинку. Такой результат относится к проверенной связке, а не ко всем установкам tmux.

Zellij 0.45 добавил поддержку Kitty Graphics Protocol наряду с Sixel. Ему всё равно нужен терминал с подходящим протоколом; настройка Zellij позволяет отключить поддержку Kitty-графики. Для конкретного просмотрщика в SSH, tmux или Zellij вид схемы нужно проверять отдельно. SSH и Zellij на этих документах я не тестировал; все графические результаты на снимках выше получены в Ghostty без мультиплексора.

Что такое chafa

chafa — отдельная утилита для вывода изображений в терминале. Она может преобразовать картинку в цветные символы ANSI/Unicode или передать её через поддерживаемый графический протокол. В нашем тесте с mdfried она служила запасным способом показать уже отрендеренную Mermaid-схему. Сама chafa не разбирает Markdown и не строит схему из кода Mermaid; поэтому при плохом символьном выводе смена шрифта не всегда исправляет картинку.

Шрифт на снимках

Все терминальные кадры статьи сделаны в Ghostty 1.3.1 с Hack Nerd Font Mono: размер 23,5 pt, окно 123 × 35 ячеек, без tmux. Это моноширинная версия Hack с кириллицей и дополнительными значками Nerd Fonts. Её же я выбрал для крупных заголовков mdfried. Первый тест с неустановленным Driod Sans Mono Dotted for Powerline дал искажённые знаки; после выбора существующего шрифта заголовки стали читаемыми.

Параметры окна при съёмке:

font-family = Hack Nerd Font Mono
font-size = 23.5
window-width = 123
window-height = 35

Фактическую сетку проверял через stty size. Именно с этими настройками следует сравнивать подписи и псевдографику на снимках; другой шрифт или размер окна могут изменить вид схем.

Термины

  • TUI — интерактивный интерфейс внутри терминала, обычно с навигацией с клавиатуры.
  • GFM — вариант Markdown с таблицами, списками задач и другими расширениями GitHub.
  • Kitty, iTerm2, Sixel — способы показать изображение прямо внутри терминала.
  • mermaid-cli / mmdc — внешняя команда, которая превращает описание Mermaid в изображение.
  • chafa — отдельная утилита, которая показывает готовые изображения в терминале через графический протокол или символы ANSI/Unicode.
  • Полублоки — символы верхней и нижней половины ячейки терминала, из которых собирают приближённую картинку.

Автор: · Дата:

Налаживаете работу с ИИ-агентами?

Помогаю командам освоить агентную разработку и настроить проверяемый рабочий процесс. Практические заметки между статьями выходят в Telegram-канале.

Работать со мнойили канал «Жизнь стартапа в стране ИИ»