Convert Images to PDFs Using JavaScript

PSPDFKit for Web enables you to convert image documents to PDF client-side, without the need for server-side processing. For more information on the supported image formats, see the list of supported file types.

Try for Free Launch Demo

To convert an image to a PDF using JavaScript, follow these steps:

  1. Load the source image. Optional: To load the image without a visual interface visible to the user, use the headless parameter.

  2. Optional: Make changes to the image. For example, add annotations.

  3. Convert the source document to a PDF with the exportPDF method. Optional: Use the outputFormat flag to create a PDF/A document. For more information, see Converting PDF to PDF/A.

  4. Save the output document. The exportPDF method returns a Promise that resolves to an ArrayBuffer that contains the output PDF document. You can use the resulting ArrayBuffer to download or persist the output PDF in storage. For more information on downloading or persisting the exported ArrayBuffer, see the guides on saving a document.

The example below loads an image and exports it to a PDF:

PSPDFKit.load({
  container: "#pspdfkit",
  document: "source.png",
  licenseKey: "YOUR_LICENSE_KEY"
}).then((instance) => {
  instance.exportPDF();
});

The example below loads a PNG image in headless mode, exports it to a PDF with conformance level PDF/A-4f, and downloads it in the client’s browser:

PSPDFKit.load({
  container: "#pspdfkit",
  document: "source.png",
  licenseKey: "YOUR_LICENSE_KEY",
  headless: true
})
  .then((instance) =>
    instance.exportPDF({
      outputFormat: {
        conformance: PSPDFKit.Conformance.PDFA_4F
      }
    })
  )
  .then(function (buffer) {
    const blob = new Blob([buffer], { type: "application/pdf" });
    const objectUrl = window.URL.createObjectURL(blob);
    downloadPdf(objectUrl);
    window.URL.revokeObjectURL(objectUrl);
  });
function downloadPdf(blob) {
  const a = document.createElement("a");
  a.href = blob;
  a.style.display = "none";
  a.download = "output.pdf";
  a.setAttribute("download", "output.pdf");
  document.body.appendChild(a);
  a.click();
  document.body.removeChild(a);
}

When exporting a document, you have several options. Refer to our guides on flattening annotations and incremental saving for more details.

Auto saving can be configured for different scenarios and use cases. You can find more information in our auto save guide.

FAQ

How do I convert images to PDF using PSPDFKit for Web?

To convert images to PDF, use PSPDFKit’s conversion API, where you can upload images, configure conversion settings, and generate a PDF document with the desired output format and quality.

What image formats are supported by PSPDFKit for conversion to PDF?

PSPDFKit supports popular image formats such as JPEG, PNG, and TIFF, allowing for a wide range of image types to be converted into PDF documents seamlessly.

Can I customize the PDF layout when converting images using PSPDFKit?

Yes, you can customize the PDF layout by specifying page sizes, margins, and image placement options in the conversion settings to create a tailored PDF document.

What are the benefits of converting images to PDF?

Converting images to PDF allows for better document management, easier sharing, and improved print quality while preserving the original image content in a standardized format.

What are the common issues in image-to-PDF conversion with PSPDFKit?

Common issues include handling large image files, maintaining image quality, and ensuring correct orientation. Optimize images before conversion and adjust PSPDFKit settings to address these challenges.