How to Export Markdown to PDF Without Losing Formatting

You have finished writing a document in Markdown. The content is clean, the headings are structured, the code blocks are highlighted. Now you need to share it as a PDF. This is where many writers hit a wall because the exported PDF looks nothing like their preview. Fonts change, syntax colors disappear, page breaks land in the wrong places.

Quick Answer: To convert Markdown to PDF without losing formatting, use a browser-based editor like edtr.md that renders Markdown to HTML first and then prints to PDF. This method preserves syntax highlighting, Mermaid diagrams, and KaTeX math in a single click, with zero installation required.

This guide covers the most reliable methods for converting Markdown to PDF while preserving your formatting.

Why Does Markdown-to-PDF Conversion Break Formatting?

Markdown is a plain-text format. It has no concept of fonts, margins, or page dimensions. When you convert to PDF, a rendering engine must make decisions about typography, spacing, and layout. Different tools make different decisions, which is why results vary so widely.

The most common issues:

• Code blocks lose syntax highlighting colors
• Custom fonts revert to system defaults
• Page breaks split headings from their content
• Tables overflow the page width
• Images are not sized correctly
• Diagrams (Mermaid, etc.) are not rendered at all

Understanding the root cause helps you pick the right tool. A browser-based approach avoids most of these pitfalls because CSS has direct control over all of these properties, including the print-color-adjust rule that forces color preservation in print output.

Which Method Is Best for Exporting Markdown to PDF?

There are three widely used methods, each with different tradeoffs in setup complexity, fidelity, and diagram support.

Method 1: Browser Print (Recommended)

The simplest and most reliable method is to render your Markdown in a browser and use the browser’s built-in print dialog to save as PDF. This is how edtr.md handles PDF export.

The advantages are significant:

• What you see in the preview is exactly what you get in the PDF
• CSS controls fonts, colors, margins, and page breaks
• Mermaid diagrams render as inline SVGs, crisp at any zoom level
• Syntax highlighting colors are preserved with print-color-adjust: exact
• No installation, no dependencies, works in any modern browser

In edtr.md, click the printer icon in the toolbar. The editor builds a self-contained HTML document with inlined fonts and styles, opens it in a new window, and triggers the print dialog. Choose “Save as PDF” as the destination.

Method 2: Pandoc

Pandoc is the Swiss Army knife of document conversion. It converts Markdown to PDF via LaTeX (or wkhtmltopdf, or Typst). Pandoc powers document conversion for thousands of academic publishers and technical teams worldwide.

pandoc document.md -o document.pdf

Pandoc produces excellent typography through LaTeX, but it requires a local TeX installation (several hundred MB). It also does not render Mermaid diagrams or browser-specific extensions without additional filters.

When to choose Pandoc:

• You need precise academic or print typography
• You are working in a CI/CD pipeline that already has a TeX environment
• Your documents do not contain diagrams or require a headless browser

Method 3: VS Code Extensions

Extensions like “Markdown PDF” for VS Code use a headless browser (Puppeteer) to render and print. They work well for basic documents but may not support all extensions like math or diagrams. The “Markdown PDF” extension has over 3 million installs, making it one of the most popular export solutions for VS Code users.

How Do You Control Page Breaks in Markdown PDF Export?

Page breaks are the most overlooked aspect of Markdown-to-PDF conversion. Without explicit control, the renderer decides where to break, often in the middle of a code block or right after a heading.

In edtr.md, you can insert a page break with this syntax:

<div class="md-pagebreak"></div>

This inserts a break-after: page element. In the editor, it appears as a dashed line labeled “page break”. In print/PDF output, it forces a new page at that exact position.

For Pandoc users, page breaks can be inserted with a raw LaTeX command:

\newpage

For CSS-based approaches, the page-break-before and page-break-after properties on heading selectors can automate breaks so every H1 or H2 starts on a new page.

Typography Tips for Clean PDFs

Good typography separates a professional PDF from a rough export. Apply these principles before printing:

• Choose a readable font. Serif fonts (like Bree Serif) work well for headings. Sans-serif fonts (Inter, Open Sans) work well for body text.
• Set consistent heading sizes. A clear size hierarchy (H1 largest, H6 smallest) makes the document scannable.
• Use adequate margins. The standard for printed documents is 2 cm on the sides and 1.5 cm top and bottom. edtr.md uses these values by default.
• Avoid very wide tables. Tables with more than 5-6 columns often overflow on A4 paper. Consider splitting or rotating.
• Set line height to at least 1.5. Dense line spacing is one of the most common readability problems in exported PDFs.

For documents with heavy code formatting, proper syntax highlighting significantly affects readability. The Markdown code formatting guide covers language tags, inline code, and fenced block best practices that carry over directly into PDF output.

Comparison: Markdown to PDF Methods

Method	Setup	Diagrams	Math	Page Breaks
Browser print (edtr.md)	None	Yes	Yes	Yes
Pandoc + LaTeX	Heavy	With filter	Yes	Yes
VS Code extension	Light	Varies	Varies	CSS only

For most writers and developers, the browser print method wins on every dimension that matters for daily use: zero setup, full diagram support, and exact WYSIWYG output.

What About Exporting Markdown with Diagrams to PDF?

Mermaid diagrams, Vega-Lite charts, and other embedded visualizations are the most common reason browser-based export outperforms Pandoc for technical documents. In edtr.md, every diagram is rendered as an inline SVG before the print dialog opens, so the PDF contains crisp, resolution-independent vector graphics. No external image files, no rendering errors.

If your documents rely heavily on diagrams, see the guide on Mermaid diagrams in Markdown for a full reference on supported diagram types and syntax.

Try It

Open edtr.md, write or paste your Markdown, and click the print icon. The PDF output preserves syntax colors, math equations, Mermaid diagrams, and respects your page break markers, all without installing anything.

For documents that need precise structure and references, the technical documentation with Markdown guide covers how to organize multi-section documents before exporting.