How this Markdown to PDF tool works
Most online Markdown-to-PDF services upload your document to a server that runs a headless browser. This page skips the server: it renders your Markdown into a print-optimised HTML document, shows it in the preview, and lets your own browser’s print engine create the PDF. The result is the same high-quality, text-selectable PDF, made on your machine.
Steps:
- Paste or type Markdown on the left.
- Check the preview.
- Open the browser’s print dialog, choose Save as PDF as the destination, and pick paper size and margins there.
The converter output (the HTML document) can also be saved as an .html file and printed later from any browser.
Print styling built in
The generated document carries a stylesheet designed for paper rather than screens:
- 11-point serif body text, sans-serif headings, and page margins of 18 mm × 16 mm.
- Headings stay with their content: page breaks are avoided directly after a heading.
- Tables, code blocks, quotes and images are not split across pages when they fit on one.
- Long tables repeat their header row on every page.
- Code blocks wrap long lines instead of being cut off at the page edge.
- Web links print their URL in brackets after the link text, so readers of the paper copy can still follow them.
- Background colours (table headers, code blocks) are kept when printing.
- Paragraphs avoid leaving single orphan or widow lines.
The document title, which many PDF viewers show, is taken from the first heading.
Supported Markdown
Everything the Markdown to HTML converter understands works here: CommonMark plus GitHub tables, strikethrough, task lists and autolinks. Column alignment in tables carries through, which is useful for right-aligned amounts on invoices and quotes. Raw HTML is allowed too, so you can force a page break with <div style="break-before: page"></div> between sections.
There are no conversion options; paper size, orientation, scale and headers/footers are all set in the print dialog. Turning off the browser’s own “Headers and footers” setting removes the URL and date it otherwise prints in the margins.
Limits worth knowing
Because the PDF comes from your browser, small differences between Chrome, Edge, Firefox and Safari are possible, mainly in fonts and page-break decisions. Images referenced by URL must be reachable from your browser to appear. Table of contents generation and page numbers inside the content are not supported.
Nothing about your document leaves your device at any stage, which makes this a good fit for confidential material.
Examples
Simple invoice
Right-aligned number columns and the bold total carry into the print layout, and the table will not split across pages.
# Invoice 2026-091
**Billed to:** Aisha Tan, Singapore
**Date:** 14 September 2026
| Item | Qty | Price |
| --- | ---: | ---: |
| Mechanical keyboard | 1 | 129.90 |
| Wireless mouse | 2 | 79.00 |
| **Total** | | **287.90** |
Payment due within 14 days. Questions? Email [email protected].
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Invoice 2026-091</title>
<style>
@page {
margin: 18mm 16mm;
}
html {
-webkit-print-color-adjust: exact;
print-color-adjust: exact;
}
body {
margin: 0;
font:
11pt/1.5 Georgia,
"Times New Roman",
serif;
color: #111;
}
@media screen {
body {
max-width: 46rem;
margin: 2rem auto;
padding: 0 1rem;
}
}
h1,
h2,
h3,
h4,
h5,
h6 {
font-family:
system-ui,
-apple-system,
"Segoe UI",
Roboto,
sans-serif;
line-height: 1.25;
margin: 1.4em 0 0.5em;
break-after: avoid;
page-break-after: avoid;
}
h1 {
font-size: 22pt;
}
h2 {
font-size: 16pt;
}
h3 {
font-size: 13pt;
}
p,
li,
blockquote {
orphans: 3;
widows: 3;
}
table,
pre,
blockquote,
figure,
img,
tr {
break-inside: avoid;
page-break-inside: avoid;
}
thead {
display: table-header-group;
}
table {
border-collapse: collapse;
margin: 1em 0;
width: auto;
}
th,
td {
padding: 4pt 8pt;
border: 1px solid #999;
vertical-align: top;
}
th {
background: #eee;
}
code,
pre {
font-family: ui-monospace, Menlo, Consolas, monospace;
font-size: 9.5pt;
}
pre {
padding: 8pt;
border: 1px solid #ccc;
background: #f6f6f6;
white-space: pre-wrap;
overflow-wrap: anywhere;
}
blockquote {
margin: 0;
padding: 0 1em;
color: #444;
border-left: 3pt solid #ccc;
}
img {
max-width: 100%;
}
a {
color: inherit;
}
a[href^="http"]::after,
a[href^="mailto:"]::after {
content: " (" attr(href) ")";
font-size: 0.85em;
color: #555;
overflow-wrap: anywhere;
}
ul.contains-task-list,
.task-list-item {
list-style: none;
}
hr {
border: 0;
border-top: 1px solid #999;
}
</style>
</head>
<body>
<main>
<h1>Invoice 2026-091</h1>
<p>
<strong>Billed to:</strong> Aisha Tan, Singapore
<strong>Date:</strong> 14 September 2026
</p>
<table>
<thead>
<tr>
<th>Item</th>
<th style="text-align: right">Qty</th>
<th style="text-align: right">Price</th>
</tr>
</thead>
<tbody>
<tr>
<td>Mechanical keyboard</td>
<td style="text-align: right">1</td>
<td style="text-align: right">129.90</td>
</tr>
<tr>
<td>Wireless mouse</td>
<td style="text-align: right">2</td>
<td style="text-align: right">79.00</td>
</tr>
<tr>
<td><strong>Total</strong></td>
<td style="text-align: right"></td>
<td style="text-align: right"><strong>287.90</strong></td>
</tr>
</tbody>
</table>
<p>
Payment due within 14 days. Questions? Email
<a href="mailto:[email protected]">[email protected]</a>.
</p>
</main>
</body>
</html>
Meeting notes with a forced page break
The raw div starts the appendix on a new page, and the task list and code block keep their formatting in print.
# Q3 planning notes
## Decisions
- Ship the tree view in October
- [x] Hire a second designer
- [ ] Review pricing
<div style="break-before: page"></div>
## Appendix: commands
```bash
npm run release -- --tag next
```
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Q3 planning notes</title>
<style>
@page {
margin: 18mm 16mm;
}
html {
-webkit-print-color-adjust: exact;
print-color-adjust: exact;
}
body {
margin: 0;
font:
11pt/1.5 Georgia,
"Times New Roman",
serif;
color: #111;
}
@media screen {
body {
max-width: 46rem;
margin: 2rem auto;
padding: 0 1rem;
}
}
h1,
h2,
h3,
h4,
h5,
h6 {
font-family:
system-ui,
-apple-system,
"Segoe UI",
Roboto,
sans-serif;
line-height: 1.25;
margin: 1.4em 0 0.5em;
break-after: avoid;
page-break-after: avoid;
}
h1 {
font-size: 22pt;
}
h2 {
font-size: 16pt;
}
h3 {
font-size: 13pt;
}
p,
li,
blockquote {
orphans: 3;
widows: 3;
}
table,
pre,
blockquote,
figure,
img,
tr {
break-inside: avoid;
page-break-inside: avoid;
}
thead {
display: table-header-group;
}
table {
border-collapse: collapse;
margin: 1em 0;
width: auto;
}
th,
td {
padding: 4pt 8pt;
border: 1px solid #999;
vertical-align: top;
}
th {
background: #eee;
}
code,
pre {
font-family: ui-monospace, Menlo, Consolas, monospace;
font-size: 9.5pt;
}
pre {
padding: 8pt;
border: 1px solid #ccc;
background: #f6f6f6;
white-space: pre-wrap;
overflow-wrap: anywhere;
}
blockquote {
margin: 0;
padding: 0 1em;
color: #444;
border-left: 3pt solid #ccc;
}
img {
max-width: 100%;
}
a {
color: inherit;
}
a[href^="http"]::after,
a[href^="mailto:"]::after {
content: " (" attr(href) ")";
font-size: 0.85em;
color: #555;
overflow-wrap: anywhere;
}
ul.contains-task-list,
.task-list-item {
list-style: none;
}
hr {
border: 0;
border-top: 1px solid #999;
}
</style>
</head>
<body>
<main>
<h1>Q3 planning notes</h1>
<h2>Decisions</h2>
<ul class="contains-task-list">
<li>Ship the tree view in October</li>
<li class="task-list-item">
<label
><input
class="task-list-item-checkbox"
checked=""
disabled=""
type="checkbox"
/>
Hire a second designer</label
>
</li>
<li class="task-list-item">
<label
><input
class="task-list-item-checkbox"
disabled=""
type="checkbox"
/>
Review pricing</label
>
</li>
</ul>
<div style="break-before: page"></div>
<h2>Appendix: commands</h2>
<pre><code class="language-bash">npm run release -- --tag next
</code></pre>
</main>
</body>
</html>
Common errors and how to fix them
| Error | Cause | Fix |
|---|---|---|
The PDF includes a URL and date in the page margins | The browser adds its own headers and footers when printing. | Untick “Headers and footers” in the print dialog’s more settings. |
Images are missing from the PDF | The image URL is relative or not reachable from your browser. | Use absolute https:// URLs, or data URIs, for images in the Markdown. |
The HTML could not be pretty-printed (it contains malformed raw HTML), so it is shown as renderedExplained | Raw HTML in the Markdown has an unclosed or mismatched tag. | Fix the tag; the document still prints, but the layout around it may be off. |
Frequently asked questions
Is my document uploaded to make the PDF?
No. The HTML is generated in the page and the PDF is written by your browser’s print function, all on your device.
How do I choose A4 or Letter?
In the print dialog, under paper size. The layout adapts because the stylesheet sets margins rather than a fixed page size.
Can I insert a page break?
Yes, add <div style=“break-before: page”></div> on its own line where the new page should start.
Why do links show their URL in the PDF?
Printed pages cannot be clicked, so the print stylesheet appends the address in brackets after each web or mailto link.