HTML to PDF: Convert Web Pages and HTML Files to PDF

By Bill Crawford  ·  February 2026  ·  8 min read  ·  Last updated October 28, 2025

Connect on LinkedIn →

Converting HTML to PDF — whether a web page, an email template, a receipt, or a report generated by a web application — is a common need for developers and businesses. HTML-to-PDF conversion is the backbone of automated document generation: invoices, contracts, statements, reports, and tickets are often generated as HTML and then converted to PDF for delivery.

Why Convert HTML to PDF?

The HTML to PDF Converter renders your HTML (including CSS styling) into a PDF. Key use cases:

• Saving web pages. Preserve a web page as a document for archiving, sharing, or printing.
• Document generation. Developers generate HTML reports and invoices programmatically and convert to PDF for distribution.
• Print-ready output. Produce print-ready PDFs from web content with precise control over layout via CSS.
• Offline access. Convert documentation or articles to PDF for offline reading.

Step-by-Step: Converting HTML to PDF

1. Upload your HTML file or paste a URL. The converter loads and renders the HTML including external CSS, images, and fonts (if reachable).
2. Set page size and margins. A4 or Letter, with appropriate margins. This determines the page layout for the PDF.
3. Convert. The HTML is rendered by a headless browser engine and output as a PDF.
4. Review and download. Check that layout, fonts, and images appear correctly.

Print CSS for Better HTML-to-PDF Output

The @media print CSS block controls how content looks when printed or exported to PDF. Adding print-specific styles dramatically improves output quality:

@media print {
  .no-print { display: none; }
  body { font-size: 12pt; }
  a { color: black; text-decoration: none; }
  @page { margin: 2cm; }
}

Common Use Cases

Invoice and Receipt Generation

Web applications generate invoices as HTML (using a template engine) and convert to PDF for emailing to customers. HTML+CSS gives full control over the invoice design; PDF gives universal delivery compatibility.

Report Generation

Data visualisation tools, analytics dashboards, and reporting systems generate HTML reports that are converted to PDF for scheduled delivery or on-demand download.

Web Page Archiving

Preserve articles, documentation pages, or competitor pages as PDFs for reference. "Print to PDF" in browsers is essentially HTML-to-PDF conversion.

Email Template Preview

Convert email templates to PDF to share mockups with clients who cannot view raw HTML.

Tips and Best Practices

• Use a defined page width. Set a fixed width (e.g., 800px) in your HTML or CSS to prevent unexpected layout shifts when rendered at PDF page width.
• Avoid background images and colours for print. Browsers strip backgrounds by default in print mode to save ink. Use -webkit-print-color-adjust: exact or print-color-adjust: exact to force backgrounds to print.
• Handle page breaks. Use page-break-before: always, page-break-after: always, and page-break-inside: avoid to control where content breaks across pages.
• Embed critical fonts. If your design uses web fonts, ensure they are loaded before conversion. Missing fonts fall back to generic serif/sans-serif.
• Test with print preview. In your browser, use Ctrl/Cmd+P and choose "Save as PDF" to preview how the HTML will look before using a converter. What you see in print preview is what a converter will produce.

Frequently Asked Questions

Why does my HTML-to-PDF output look different from the browser?

Print rendering differs from screen rendering. Backgrounds may be removed, interactive elements do not function, and media queries may apply differently. Use @media print styles to control the print output specifically.

Can I convert a live URL to PDF?

Yes — some converters accept a URL and fetch the page before converting. Be aware that dynamically generated content (JavaScript-rendered pages, login-required pages) may not convert correctly without headless browser rendering.

How do I handle multi-page HTML content?

HTML flows across pages automatically based on the page height. Use page-break-* CSS properties to control where breaks occur and prevent content (like tables or headings) from breaking mid-element.

What tools do developers use for HTML-to-PDF generation?

Headless Chrome via Puppeteer (Node.js) is the most common modern approach. Wkhtmltopdf is a popular open-source alternative. PDFKit and ReportLab generate PDF directly from code. For cloud solutions, WeasyPrint and Prince are widely used.

Related Tools