by GelFuzion
Home / Brand & Media / HTML to PDF
03.08Brand & Media

HTML to PDF

Paste or upload HTML, preview it on a real A4, Letter or Legal page, and save it as a PDF through your browser's own print engine. Sharp vector text you can select and search, no upload, no watermark.

Updated
Orientation
  1. Click Save as PDF. Your browser's print dialog opens.
  2. Set Destination (or Printer) to Save as PDF.
  3. Under More settings, tick Background graphics and untick Headers and footers.
  4. Save. The preview shows the first page; content flows onto more pages automatically.

Why this uses your browser's print engine

Most free HTML to PDF converters take a screenshot of your page and wrap it in a PDF. The result is blurry when zoomed, the text cannot be selected or searched, and file sizes balloon. Others upload your HTML to a server, which is a problem for invoices, contracts and anything with client data in it.

This tool takes a different route. It renders your HTML in a sandboxed frame, applies the page size and margins you choose with a CSS @page rule, and hands it to the browser's built-in print engine. Chrome, Edge, Safari and Firefox all ship a high-quality PDF writer that produces real vector text, embedded fonts and clickable links. The trade-off is one extra click in the print dialog, and in return you get the best fidelity available in a browser without anything leaving your device.

Writing HTML that prints well

Control page breaks

Content flows onto new pages automatically. Use CSS to stop a table row, an image or a card from being split across two pages, and to force a break before a new section:

@media print {
  tr, img, .card { break-inside: avoid; }
  h2 { break-after: avoid; }
  .new-page { break-before: page; }
  nav, .no-print { display: none; }
}

Use print-friendly units

Points (pt), millimeters and inches map predictably to paper. Body text at 10 to 11pt reads comfortably on A4 and Letter. Avoid fixed pixel widths wider than the printable area: A4 portrait with 15 mm margins leaves about 680 CSS pixels of width.

Use absolute URLs for images and fonts

Pasted HTML has no folder of its own, so relative paths like images/logo.png will not resolve. Use full https:// URLs, or embed small images as data URIs. Google Fonts links work as long as you are online.

Keep it static

For safety, scripts in your HTML do not run here. If your document relies on JavaScript to build charts or tables, render it in your own browser first and save the result, or export the finished markup from your app.

Common uses

  • Invoices and quotes generated from an HTML template, saved as a client-ready PDF.
  • Email templates archived for approval or sign-off.
  • Documentation and reports exported from Markdown or a static site generator.
  • Résumés built in HTML and CSS, with full control over typography.

Frequently asked questions

Is the text in the PDF selectable and searchable?

Yes. The browser's print engine writes real text, vector shapes and embedded fonts into the PDF, unlike screenshot-based converters that produce a flat image.

Why are my background colors missing?

Browsers skip backgrounds when printing to save ink. Leave the print backgrounds option on in this tool, and also tick Background graphics under More settings in the print dialog.

Does JavaScript in my HTML run?

No. The preview is a sandboxed frame with scripts disabled, so pasted code cannot run or reach this page. Render charts or dynamic content to static HTML before converting.

How do I remove the date and URL from the page edges?

Those come from the browser, not your HTML. Untick Headers and footers under More settings in the print dialog before saving.