Back to blog
PDFInvoicesAutomation

How to Convert Webpages to PDF with an API: Invoices, Reports & More

Generate professional PDFs from HTML templates using a screenshot API. Perfect for invoices, receipts, certificates, and automated report generation.

2025-04-017 min read

Generating PDFs from HTML is one of the most common automation needs in business applications. Instead of wrestling with PDF libraries and their rendering quirks, you can use a screenshot API with PDF output to convert any HTML page into a clean, printable document.

Why HTML-to-PDF via API?

Traditional PDF generation approaches have serious drawbacks:

  • wkhtmltopdf — Outdated rendering engine, poor CSS support
  • PDFKit / jsPDF — Imperative API, can't render complex layouts
  • Headless Chrome locally — Heavy, fragile, hard to scale

A screenshot API with PDF format support gives you:

  • Modern CSS and JavaScript rendering
  • Pixel-perfect output that matches your browser preview
  • No local dependencies or binary installations
  • Scalable from 1 to 100,000 PDFs per month

Example: Generating an Invoice PDF

Step 1: Build Your Invoice as HTML

<style>
  @page { size: A4; margin: 20mm; }
  body { font-family: 'Inter', sans-serif; color: #1e293b; }
  .invoice-header { display: flex; justify-content: space-between; margin-bottom: 40px; }
  .line-items { width: 100%; border-collapse: collapse; }
  .line-items th, .line-items td { padding: 10px; border-bottom: 1px solid #e2e8f0; }
</style>

Step 2: Host the Invoice Template

app.get('/invoice/:id', async (req, res) => {
  const invoice = await db.getInvoice(req.params.id);
  res.send(renderInvoiceHtml(invoice));
});

Step 3: Generate the PDF

const pdfResponse = await fetch(
  `https://pxshot.dev/api/capture?url=${encodeURIComponent(invoiceUrl)}&format=pdf&api_key=YOUR_KEY`
);
const pdfBuffer = await pdfResponse.arrayBuffer();

Other Use Cases

  • Receipts — Email PDF receipts after purchase
  • Reports — Weekly analytics dashboards as PDFs
  • Certificates — Course completion or event attendance certificates
  • Contracts — Pre-filled agreement documents
  • Tickets — Event tickets with QR codes

Tips for Better PDF Output

  • Use @page CSS for paper size and margins
  • Avoid viewport-dependent layouts — use fixed widths
  • Test with window.print() in your browser first
  • Use web fonts with @font-face for consistent typography

PxShot supports PDF output with a single parameter change. Read the docs or try it free.