Page Numbers and Page Breaks
import {PdfDocument} from "@ironsoftware/ironpdf";

(async () => {
    const html = `
        <p> Hello Iron</p>
        <p> This is 1st Page </p>
        <div style='page-break-after: always;'></div>
        <p> This is 2nd Page</p>
        <div style='page-break-after: always;'></div>
        <p> This is 3rd Page</p>
    `;

    // Configure render options
    const options = {
        htmlHeader: {
            htmlFragment: "<center><i>{page} of {total-pages}<i></center>",
            dividerLine: true,
            maxHeight: 15,
        }
    };

    const pdf = await PdfDocument.fromHtml(html, {renderOptions: options});

    // Save the PDF
    await pdf.saveAs("pageNumber.pdf");
})();
npm i @ironsoftware/ironpdf
Page Numbers and Page Breaks

Page Numbers and Page Breaks

Page breaks in HTML work perfectly when rendering to PDF using IronPDF.

In HTML, a page break is a marker or instruction that tells a web browser or a rendering engine to start a new page when displaying or printing content. Page breaks are typically used when you want to control the layout of printed documents or ensure that certain content starts on a fresh page.

Furthermore, the code below configures rendering options to include the page number at the bottom center of the PDF document. The page number is displayed in the format "{page} of {total-pages}" and is limited to a maximum height of 15 units.

For more information on how to efficiently manage page breaks while converting HTML to PDF, refer to the comprehensive guide on IronPDF features. IronPDF is part of a suite of powerful tools provided by Iron Software tailored for various file processing needs, including barcode generation with IronBarcode, Excel manipulation through IronXL, and optical character recognition with IronOCR.

Explore Code Examples for Page Numbers & Breaks in PDFs
View on GitHub

Ready to Get Started?

Version:2026.11just released