PDF Options & Customization

Page Format Options

Standard Formats

Choose from common paper sizes for your PDFs:
  • A4 (210mm × 297mm) - Most common worldwide, ideal for documents
  • A3 (297mm × 420mm) - Larger format perfect for presentations and charts
  • Letter (8.5” × 11”) - US standard format for business documents
{
  "options": {
    "format": "A4"  // or "A3", "Letter"
  }
}

Custom Dimensions

Define exact page sizes for specialized use cases:
{
  "options": {
    "width": "8.5in",
    "height": "11in"
  }
}
You can use various units: px, in, cm, mm, pt

Page Orientation

Control how your content is displayed:

Portrait (Default)

{
  "options": {
    "landscape": false
  }
}
Taller than wide - perfect for documents, letters, and reports.

Landscape

{
  "options": {
    "landscape": true
  }
}
Wider than tall - ideal for charts, presentations, and wide tables.

Margins

Control the white space around your content:

Standard Margins

{
  "options": {
    "margin": {
      "top": "25mm",
      "right": "15mm", 
      "bottom": "25mm",
      "left": "15mm"
    }
  }
}

Margin Guidelines

Minimal

5-10mm for edge-to-edge content and maximum space utilization

Standard

15-20mm for regular documents with balanced spacing

Professional

25-30mm for formal documents requiring generous margins

Background Graphics

Control whether CSS backgrounds and images are included:
{
  "options": {
    "printBackground": true
  }
}
  • true: Include CSS backgrounds, images, and colors
  • false: White background only (faster processing, smaller files)
Set printBackground: true for presentations and marketing materials. Use false for text-heavy documents to reduce file size.

Scale

Zoom your content to fit better on the page:
{
  "options": {
    "scale": 0.8
  }
}
  • Range: 0.1 to 2.0
  • 1.0: Normal size (default)
  • 0.8: 80% size (fit more content)
  • 1.2: 120% size (larger text/images)

CSS Best Practices for PDF

/* Optimal typography for PDFs */
body {
  font-family: Arial, sans-serif;
  line-height: 1.4;
  color: #333;
  font-size: 12pt;
}

/* Prevent awkward page breaks */
h1, h2, h3 {
  page-break-after: avoid;
  margin-top: 24pt;
  margin-bottom: 12pt;
}

/* Keep tables together */
table {
  page-break-inside: avoid;
  border-collapse: collapse;
  width: 100%;
}

/* Force page breaks where needed */
.page-break {
  page-break-before: always;
}

/* Hide elements in print */
@media print {
  .no-print {
    display: none;
  }
  
  .print-only {
    display: block;
  }
}

Page Break Control

Control how content breaks across pages:
/* Prevent breaking inside elements */
.keep-together {
  page-break-inside: avoid;
}

/* Force breaks before elements */
.new-page {
  page-break-before: always;
}

/* Avoid breaks after headings */
h1, h2, h3, h4, h5, h6 {
  page-break-after: avoid;
}

Table Optimization

Make tables work well in PDFs:
table {
  width: 100%;
  border-collapse: collapse;
  page-break-inside: auto;
}

tr {
  page-break-inside: avoid;
  page-break-after: auto;
}

thead {
  display: table-header-group;
  page-break-after: avoid;
}

tbody {
  display: table-row-group;
}

Advanced Formatting

Headers and Footers

Use CSS @page rules for headers and footers:
@page {
  margin-top: 2in;
  margin-bottom: 2in;
  
  @top-center {
    content: "Document Title";
    font-family: Arial;
    font-size: 10pt;
    color: #666;
  }
  
  @bottom-center {
    content: "Page " counter(page) " of " counter(pages);
    font-family: Arial;
    font-size: 10pt;
  }
  
  @bottom-right {
    content: "Generated " date();
  }
}

Custom Fonts

Embed fonts for consistent typography:
@font-face {
  font-family: 'CustomFont';
  src: url('data:font/woff2;base64,d09G...');
  font-weight: normal;
  font-style: normal;
}

body {
  font-family: 'CustomFont', Arial, sans-serif;
}
Use web-safe fonts as fallbacks. Custom fonts should be embedded as base64 data URLs for reliability.

What to Avoid

CSS Properties That Don’t Work Well

Avoid these CSS features in PDFs:
  • position: fixed - Use position: absolute instead
  • Complex animations and transitions
  • Viewport units (vw, vh) - Use fixed units instead
  • box-shadow with blur - May not render correctly
  • Complex CSS Grid layouts - Use Flexbox or tables

HTML Elements to Avoid

  • <video> and <audio> elements
  • Interactive forms (unless for printing forms)
  • JavaScript-dependent content
  • External iframes

Optimization Tips

Performance

Optimize Images

Use compressed images and appropriate formats (PNG for graphics, JPEG for photos)

Minimize HTML

Remove unnecessary whitespace and comments from HTML before sending

Limit File Size

Keep HTML content under 2MB for fastest processing

Use Web Fonts

Stick to system fonts or embed fonts as base64 data URLs

Quality

/* High-quality image rendering */
img {
  max-width: 100%;
  height: auto;
  image-rendering: optimizeQuality;
}

/* For high-DPI displays */
@media (-webkit-min-device-pixel-ratio: 2) {
  img {
    image-rendering: -webkit-optimize-contrast;
  }
}

Testing Your PDFs

Preview Recommendations

1

Test in Browser

Use browser print preview to catch major layout issues
2

Generate Test PDF

Create a test PDF with your actual content
3

Check All Pages

Review every page for layout problems
4

Test Different Sizes

Try different page formats if needed
5

Validate Links

Ensure internal links work properly

Common Issues to Check

  • Text cutoff at page edges
  • Images not displaying or too large
  • Tables breaking awkwardly across pages
  • Headers/footers positioning correctly
  • Page breaks occurring in logical places

Pro Tip

Create templates for common document types (invoices, reports, letters) with tested CSS to ensure consistent results.