Markdown to PDF Converter
Turn Markdown into a polished, paginated PDF with syntax highlighted code blocks, tables, headers, footers, and page numbers. Everything renders and converts right in your browser.
Why this Markdown to PDF tool builds a standalone document inside a hidden iframe
Markdown itself is not a page layout format, it has no concept of margins or page breaks. This tool bridges that gap in two stages. First marked.js parses your Markdown into HTML, with highlight.js coloring any fenced code blocks. Then that HTML is wrapped inside a complete, self contained document and captured with html2canvas before being assembled into pages by jsPDF, through the combined html2pdf.js library. Every step runs client side. Your document text is never sent to a server.
Why it renders inside an iframe rather than the live page
A comment in the tool’s own source documents two earlier failed attempts that captured a plain <div> sitting directly in the host page, alongside the textarea, other cards, and whatever the surrounding page template renders. Both attempts still produced blank PDFs even after fixing off-screen positioning and container height limits, because the real problem was capturing an element embedded inside a complex, busy document rather than any single CSS property. The fix borrowed the same isolated-iframe technique already proven in this site’s HTML to PDF converter: build a small standalone HTML document containing only the rendered Markdown and its own copy of the styling it needs, load it into a hidden iframe through srcdoc, and capture that iframe’s own body instead.
marked.parse() converts your input into HTML on every keystroke for the live preview, and highlight.js runs against each <pre><code> block it finds.
-x to repeats, so the optional table of contents can link to each section.
<html><head></head><body> string and loaded into a hidden iframe via srcdoc.
DOC_CSS is a separate, dedicated stylesheet from the one used for the live on page preview, deliberately. The live preview’s CSS class carries a max-height and overflow:auto meant for an on-screen scroll box, a rule that has no place in a document being paginated for print.
Themes and typography
| Theme | Background / text |
|---|---|
| Light | White background, dark gray text, the default |
| Sepia | Warm cream background, brown text, for long-form reading |
| Dark | Near-black background, light text, with adjusted table and code block borders |
Font choice runs independently of theme, with sans, serif and monospace stacks each swapped in through a body class rather than inline styles, keeping the standalone document’s CSS small and easy to reason about.
Table of contents
Built from the same heading list used for anchor ids, rendered as a linked list at the top of the document when enabled, entirely separate from the live preview’s DOM.
Header, footer, page numbers
Added after the raster capture, drawn as real PDF text on every page rather than baked into the image, so they stay sharp regardless of your chosen render scale.
Markdown and PDF tooling
- marked.js documentation describes the CommonMark-based parser converting your Markdown to HTML.
- CommonMark specification is the Markdown dialect marked.js targets for consistent parsing.
- highlight.js documentation covers the syntax highlighting applied to fenced code blocks.
- html2canvas documentation explains the rasterization step feeding the PDF.
- ISO 32000-2 is the PDF 2.0 specification the output file conforms to.
From plain notes to shareable documents
Turning a README into a shareable PDF for someone outside your repository, exporting technical documentation with a real table of contents, producing a printable copy of release notes written in Markdown, or converting a blog draft into a paginated PDF proof before publishing.
FAQ: Markdown to PDF Converter
Yes. Tables, task lists, strikethrough text, and fenced code blocks with language tags all parse correctly through the same marked.js engine that powers GitHub flavored Markdown rendering.
Yes. Enter your header and footer text in the Document Settings card, and leave Add Page Numbers checked. Every page of the finished PDF will show your header, footer, and a page number automatically.
Yes. Fenced code blocks tagged with a language, for example a python or js label after the triple backticks, are run through highlight.js before conversion, so keywords, strings, and comments keep their color coding in the final PDF.
There is no hard page limit since everything runs in your browser rather than on a server. Very long documents, hundreds of pages, will simply take longer to render and may use more memory, depending on your device.
No. Parsing, syntax highlighting, and PDF rendering all happen locally in your browser using open source libraries. Your text never leaves your device.
From the blog
Format guides and gotchas
What each format stores, and what quietly disappears in conversion.
