htmlcsstopdf

n8n community node to convert HTML and CSS to PDF using PdfMunk API - perfect for invoices, reports, certificates, and document generation

Package Information

Released: 9/23/2025
Downloads: 7,650 weekly / 15,714 monthly
Latest Version: 2.0.3
Author: Rishabh Dugar

Available Nodes

HTML to PDF icon
HTML to PDF
No description available

Documentation

n8n-nodes-htmlcsstopdf

HTML to PDF Banner

An n8n community node for converting HTML content to PDF documents and capturing website screenshots as PDFs using the PDFMunk API.

Features

  • HTML to PDF: Convert custom HTML/CSS content to PDF documents
  • Website to PDF: Capture full-page website screenshots as PDF files
  • Flexible Output: Support for URL, PNG, and Base64 response formats
  • Customizable Viewport: Configure viewport dimensions for optimal rendering
  • Full Page Capture: Option to capture entire web pages or specific viewport areas

Installation

Follow the installation guide in the n8n community nodes documentation.

Install via n8n's Community Nodes feature:

  1. Go to Settings > Community Nodes in your n8n instance
  2. Install n8n-nodes-htmlcsstopdf

Or install manually:

npm install n8n-nodes-htmlcsstopdf

Installation

<<<<<<< HEAD

  • n8n version 0.187.0 or higher
  • PDFMunk API credentials (sign up at PDFMunk)

Credentials

This node requires PDFMunk API credentials:

  1. Create an account at PDFMunk
  2. Generate your API key from the dashboard
  3. In n8n, create new credentials of type "HTMLCSStoPDF API"
  4. Enter your PDFMunk API key

Operations

HTML to PDF

Convert custom HTML and CSS content into PDF documents.

Parameters:

  • HTML Content: The HTML content to convert
  • CSS Content: Optional CSS styling for the HTML
  • Viewport Width: Viewport width in pixels (default: 1080)
  • Viewport Height: Viewport height in pixels (default: 720)
  • Response Format: Choose between URL, PNG, or Base64 output

Example Use Cases:

  • Generate invoices from HTML templates
  • Create reports with custom styling
  • Convert rich text content to PDF documents

URL to PDF

Capture website screenshots and save them as PDF documents.

Parameters:

  • URL: The website URL to capture
  • Full Page: Capture the entire page (default: true)
  • Wait Time: Milliseconds to wait before capturing (default: 10000)
  • Viewport Width: Viewport width in pixels (default: 1080)
  • Viewport Height: Viewport height in pixels (default: 720)

Example Use Cases:

  • Archive web pages as PDFs
  • Generate website screenshots for documentation
  • Create visual reports of web content

Example Workflows

Generate Invoice PDF

// Previous node provides customer data
{
  "operation": "htmlToPdf",
  "html_content": `
    <html>
      <body>
        <h1>Invoice #{{$json.invoiceNumber}}</h1>
        <p>Customer: {{$json.customerName}}</p>
        <p>Amount: ${{$json.amount}}</p>
      </body>
    </html>
  `,
  "css_content": `
    body { font-family: Arial, sans-serif; }
    h1 { color: #333; }
  `,
  "response_format": "base64"
}

Website Screenshot

{
  "operation": "urlToPdf",
  "url": "https://example.com",
  "full_page": true,
  "wait_till": 5000,
  "viewPortWidth": 1920,
  "viewPortHeight": 1080
}

Output

The node returns:

  • URL format: Direct link to the generated PDF
  • PNG format: PNG image data
  • Base64 format: Base64 encoded PDF data

Error Handling

The node includes comprehensive error handling:

  • Invalid HTML/CSS content
  • Network connectivity issues
  • API rate limiting
  • Invalid URLs or parameters

Compatibility

  • n8n version: 0.187.0+
  • Node.js: 18.0.0+
  • Supported formats: HTML, CSS, PDF, PNG, Base64

Resources

Support

Version History

  • 1.0.0: Initial release with HTML to PDF and URL to PDF operations

Contributing

Contributions are welcome! Please read the contributing guidelines and submit pull requests for any improvements.

License

MIT

Built with ❤️ for the n8n community

Community Nodes (Recommended)

  1. Go to Settings > Community Nodes in your n8n instance
  2. Click Install a community node
  3. Enter n8n-nodes-htmlcsstopdf
  4. Click Install

Manual Installation

# Navigate to your n8n installation directory
cd ~/.n8n/nodes

# Install the package
npm install n8n-nodes-htmlcsstopdf

Docker

Add the package to your n8n Docker container:

FROM n8nio/n8n:latest
USER root
RUN npm install -g n8n-nodes-htmlcsstopdf
USER node

Getting Your PdfMunk API Key

  1. Sign Up: Visit PdfMunk.com and create an account
  2. Verify Email: Check your email and verify your account
  3. Access Dashboard: Log in to your PdfMunk dashboard
  4. Generate API Key:
    • Navigate to the "API Keys" section
    • Click "Generate New API Key"
    • Copy your API key securely
  5. Choose Plan: Select a plan based on your usage needs:
    • Free Tier: 100 conversions/month
    • Starter: 1,000 conversions/month
    • Professional: 10,000 conversions/month
    • Enterprise: Custom limits

Configuration

Setting Up Credentials

  1. In n8n, go to Credentials
  2. Click + Add Credential
  3. Search for "HtmlCssToPdf API"
  4. Enter your PdfMunk API key
  5. Test the connection
  6. Save the credential

Usage

Basic HTML to PDF Conversion

{
  "html": "<h1>Hello World</h1><p>This is a test document.</p>",
  "css": "h1 { color: blue; } p { font-size: 14px; }",
  "options": {
    "format": "A4",
    "orientation": "portrait"
  }
}

Advanced Usage Examples

1. Invoice Generation

<!DOCTYPE html>
<html>
<head>
    <style>
        .invoice { font-family: Arial, sans-serif; }
        .header { background-color: #f0f0f0; padding: 20px; }
        .total { font-weight: bold; font-size: 18px; }
    </style>
</head>
<body>
    <div class="invoice">
        <div class="header">
            <h1>Invoice #12345</h1>
        </div>
        <div class="total">Total: $299.99</div>
    </div>
</body>
</html>

2. Report Generation

<div class="report">
    <h1>Monthly Report</h1>
    <table border="1">
        <tr><th>Metric</th><th>Value</th></tr>
        <tr><td>Sales</td><td>$50,000</td></tr>
        <tr><td>Growth</td><td>15%</td></tr>
    </table>
</div>

3. Certificate Generation

<div class="certificate">
    <h1>Certificate of Completion</h1>
    <p>This certifies that <strong>John Doe</strong> has completed the course.</p>
    <div class="signature">Authorized Signature</div>
</div>

Use Cases

Business Applications

  • Invoice Generation: Automatically generate invoices from order data
  • Report Creation: Convert analytics data into professional PDF reports
  • Contract Generation: Create contracts from templates with dynamic data
  • Certificate Issuance: Generate certificates for course completions
  • Receipt Creation: Convert transaction data into PDF receipts

Content Management

  • Document Archival: Convert web pages to PDF for archival purposes
  • Newsletter PDFs: Transform HTML newsletters into PDF format
  • eBook Creation: Generate PDF books from HTML content
  • Documentation: Convert online docs to downloadable PDFs

Marketing & Sales

  • Proposal Generation: Create branded proposals from CRM data
  • Brochure Creation: Generate marketing materials dynamically
  • Price Lists: Convert product catalogs to PDF format
  • Quotation PDFs: Transform quotes into professional PDFs

Node Options

Option Type Description Default
HTML Content string The HTML content to convert Required
CSS Styles string Custom CSS for styling Optional
Page Format select Paper size (A4, Letter, Legal, etc.) A4
Orientation select Portrait or Landscape Portrait
Margins object Page margins in pixels {top: 20, right: 20, bottom: 20, left: 20}
Header HTML string Header content for each page Optional
Footer HTML string Footer content for each page Optional
Scale number Zoom level (0.1 to 2.0) 1

Error Handling

The node provides detailed error messages for common issues:

  • Invalid API Key: Check your PdfMunk credentials
  • HTML Parse Error: Validate your HTML syntax
  • CSS Error: Check your CSS for syntax errors
  • Rate Limit: Upgrade your PdfMunk plan or wait for reset
  • Network Error: Check your internet connection

Workflow Examples

Example 1: E-commerce Invoice

{
  "nodes": [
    {
      "name": "Order Webhook",
      "type": "n8n-nodes-base.webhook"
    },
    {
      "name": "Generate Invoice HTML",
      "type": "n8n-nodes-base.function"
    },
    {
      "name": "Convert to PDF",
      "type": "n8n-nodes-htmlcsstopdf.htmlcsstopdf"
    },
    {
      "name": "Email PDF",
      "type": "n8n-nodes-base.emailSend"
    }
  ]
}

Example 2: Scheduled Reports

{
  "nodes": [
    {
      "name": "Schedule Trigger",
      "type": "n8n-nodes-base.cron"
    },
    {
      "name": "Fetch Analytics Data",
      "type": "n8n-nodes-base.httpRequest"
    },
    {
      "name": "Build Report HTML",
      "type": "n8n-nodes-base.function"
    },
    {
      "name": "Generate PDF Report",
      "type": "n8n-nodes-htmlcsstopdf.htmlcsstopdf"
    },
    {
      "name": "Save to Google Drive",
      "type": "n8n-nodes-base.googleDrive"
    }
  ]
}

FAQ

Q: Is there a free tier?
A: Yes, PdfMunk offers 100 free conversions per month.

Q: What HTML features are supported?
A: Most modern HTML5 and CSS3 features are supported, including flexbox, grid, and media queries.

Q: Can I use external images?
A: Yes, images accessible via URL will be included in the PDF.

Q: What's the maximum file size?
A: PDFs can be up to 10MB on most plans. Check PdfMunk documentation for current limits.

Q: Can I customize headers and footers?
A: Yes, you can add custom HTML headers and footers to each page.

Support

Contributing

Contributions are welcome! Please read our contributing guidelines and submit pull requests.

License

MIT License - see LICENSE file for details.

Changelog

v2.0.2

  • Improved error handling
  • Added support for custom headers/footers
  • Performance optimizations

v2.0.1

  • Bug fixes and stability improvements

v2.0.0

  • Complete rewrite with new PdfMunk API
  • Enhanced CSS support
  • Better error messages

    dc0ef71 (Update Doc)

Discussion