How to Save a Webpage as PDF with a Custom Paper Size
Learn how to save a webpage as a PDF at a custom page size, using browser print settings, CSS, managed Chrome policy, or WebView2.
Short answer: Open the webpage’s print preview, choose the browser’s PDF destination, select a paper size if one is offered, adjust scale and margins, then preview and save. A paper-size menu does not necessarily let you enter arbitrary dimensions. If you need an exact custom size, use a print stylesheet with CSS @page when you control the page, a managed Chrome policy in an organization, or a developer API such as WebView2. Browser controls vary by browser, operating system, and PDF destination.
1. Save a webpage to PDF from the browser
- Open the webpage and open Print or print preview. In Microsoft Edge, use the menu’s Print command or press Ctrl+P on Windows or Command+P on macOS.
- Choose a PDF destination. Firefox, for example, offers Save to PDF.
- Expand the additional settings and inspect the available paper sizes, scale, margins, page range, headers and footers, and background options. The exact settings depend on the browser and destination.
- If the exact size is unavailable, choose the closest available size and adjust scale and margins only if that produces an acceptable result. Scaling changes the content size; margins reduce the printable area.
- Review every page in the preview. Check clipping, page breaks, text legibility, backgrounds, and headers or footers before saving.
- Save the file. If exact dimensions matter, inspect the resulting PDF’s page dimensions in a PDF viewer or editor.
Firefox documents paper size, scale, and margins in its print settings. Edge documents scaling choices including Fit to printable area, Actual size, and a custom scale percentage, along with margins and background graphics. These options do not mean every browser dialog supports arbitrary paper dimensions. See Firefox’s print help and Microsoft Edge’s print instructions.
2. Choose the right route for an exact size
| Situation | Use this route | Key limitation |
|---|---|---|
| You just need a PDF and a standard size is close enough | Browser print preview | Available sizes and controls vary by browser and destination. |
| You control the webpage or its print stylesheet | CSS @page |
It controls printed layout for that page; it is not a setting a reader can impose on an unrelated site. |
| You administer Chrome in an organization | Chrome’s default printing page size policy | Requires managed browser policy and compatible dimensions and printer support. |
| You are building a Windows application with WebView2 | WebView2 PDF APIs and custom print settings | This is an application-development option, not a normal browser preference. |
3. Set a custom page size with CSS
When you own the webpage, define the page box in a print stylesheet. Chrome for Developers describes @page for printed page dimensions and margins and notes support in Chrome and Firefox. The page’s content is then laid out and fragmented across pages according to the print layout.
/* Put this in the page stylesheet or a stylesheet loaded for printing. */
@media print {
@page {
/* Example: 5 by 7 inches */
size: 5in 7in;
margin: 0.25in;
}
html, body {
margin: 0;
}
/* Avoid splitting a card across pages where possible. */
.card {
break-inside: avoid;
}
}
Use physical units such as inches, millimeters, or centimeters when the output must match a paper specification. The two dimensions define page width and height; reverse them for landscape. The margin rule sets the page margin. You can also use four values to set top, right, bottom, and left separately, for example margin: 10mm 12mm 14mm 12mm.
@page {
size: 210mm 297mm; /* A4 portrait dimensions */
margin: 12mm 10mm;
}
@page landscape {
size: 297mm 210mm;
}
@media print {
.landscape-section {
page: landscape;
}
}
In the print dialog, select the PDF destination and preview the result. Browser headers and footers may be added automatically when space permits; turn them off in the dialog if you do not want them. Very small or zero margins can affect whether those headers and footers fit. CSS page size does not guarantee identical pagination across browsers or content: long text, images, fonts, and layout rules can change page breaks.
Read Chrome for Developers’ guide to paged media and print margins for the page-box model and browser printing behavior.
4. Configure a custom size in managed Chrome
Organizations that manage Chrome can set the Default printing page size policy. Google documents a Custom option with required height and width in micrometers. This policy is available on ChromeOS and Chrome browser on Windows, Mac, and Linux. It is an administrator configuration, not evidence that every consumer print dialog has a custom-size field.
Google cautions that the policy is ignored if the dimensions are incompatible or the selected printer does not offer that paper size. Confirm the printer or PDF destination can use the requested dimensions, deploy the policy through your organization’s normal Chrome management process, and validate the resulting preview and PDF. See Google’s Chrome Enterprise printing policy documentation.
5. Generate a custom-size PDF with WebView2
If you are developing a Windows application that hosts web content, WebView2 provides PrintToPdf and PrintToPdfStream routes with custom print settings. Use these when the application needs to set PDF output programmatically. ShowPrintUI opens the browser or operating system print dialog and offers less control over customization.
The exact API surface and setting names depend on the WebView2 SDK and language projection. Follow Microsoft’s current API reference for the version used by your application rather than copying settings from a different SDK version. See Microsoft’s WebView2 printing documentation.
6. Check the PDF before you rely on it
- Page dimensions: Confirm the PDF page boxes match the required width and height.
- Clipping: Check content at each page edge, including tables, wide images, and navigation elements.
- Pagination: Look for headings stranded at the bottom of a page, split cards, or unexpectedly blank pages.
- Legibility: Make sure scaling has not made text too small.
- Margins and headers: Check whether browser headers, footers, or margins use space needed by your content.
- Backgrounds: Enable background printing if the document depends on background colors or images, where that option is available.
Web pages can print differently from how they look on screen. Previewing is especially important when an exact page size, clean pagination, or background graphics are required.
7. Troubleshooting
| Symptom | Likely cause | What to try |
|---|---|---|
| The custom size is missing from the print dialog | The selected browser or PDF destination exposes preset sizes only. | Check whether a system print dialog offers more options. If you control the page, use @page; in a managed Chrome environment, ask the administrator about the page-size policy. |
| The PDF has the wrong dimensions | The destination ignored the requested size, or a preset size was selected instead. | Inspect the PDF page dimensions, verify the chosen destination supports the size, and check the print preview. For Chrome policy, confirm the dimensions are valid and available to the selected printer. |
| Content is clipped at an edge | Content exceeds the printable area, margins are too small, or scaling is set too large. | Increase margins, reduce scale, or adjust the page’s print CSS. Review wide elements and long unbroken text. |
| Text is unexpectedly tiny | Fit-to-page scaling shrank a wide or long layout. | Try a larger page, adjust the print layout, or use actual size and inspect pagination. |
| Colors or images are missing | Background graphics are disabled or the page uses screen-only styling. | Enable background printing if available, and add or adjust print-specific CSS if you own the page. |
| Headers or footers appear unexpectedly | The browser adds print metadata independently of page content. | Turn off headers and footers in the print dialog. Check whether page margins leave room for them. |
| Chrome ignores the managed custom size | The dimensions are incompatible or unavailable on the selected printer. | Review the policy values and the printer’s supported paper sizes, then test the policy again. |
| Pages break in awkward places | Print layout fragments content differently from screen layout. | Use print CSS, avoid splitting suitable components with break-inside: avoid, and inspect every page in preview. |
8. Performance, reliability, and cost
For occasional documents, browser print-to-PDF is usually the simplest route and does not require a separate screenshot service. CSS is useful when you control the content and need repeatable print dimensions. Managed policy suits centrally administered Chrome installations; WebView2 suits software that needs programmatic PDF generation. Each route depends on the browser, destination, printer configuration, and page content, so verify output dimensions and pagination in the environment that will produce the final PDF.
For automated capture workflows, a screenshot or PDF API can avoid maintaining browser-print setup. ScreenshotNeo is a website screenshot API and MCP server from ScreenshotNeo; it can return PNG, JPEG, WebP, or PDF from a GET request. Its PDF options include paper size, margins, landscape, and page ranges. See the ScreenshotNeo API documentation for the supported request options. API usage has a plan cost, while browser printing itself does not require an API plan.
Or skip the browser setup
For an API-generated PDF, ScreenshotNeo accepts paper size, margins, landscape, and page ranges. This runnable cURL request captures a webpage as a PDF:
curl -G "https://api.screenshotneo.com/v1/shot" \
-d access_key=YOUR_API_KEY \
--data-urlencode url=https://stripe.com \
-d format=pdf \
-o page.pdfSee the API docs for PDF parameters and the exact option names. Cookie banners, popups, and chat widgets are removed before the shot. Bot checks, blank pages, and failed loads are never billed. An MCP server lets AI agents use screenshot and PDF capture tools. The free plan includes 1,000 screenshots per month with no card; paid plans start at $5 for 3,000 shots.
Sign up free for 1,000 screenshots a month, with no card required.
FAQ
Can I enter any custom paper size in Chrome’s Save to PDF dialog?
Do not assume so. Available controls depend on the browser and destination. Google documents custom dimensions for managed Chrome policy, while ordinary print dialogs may expose only preset sizes.
Can CSS change the PDF size of a webpage I do not control?
Not reliably through the page’s own stylesheet. The @page method is for a page or stylesheet you control; otherwise use available print-dialog options or a managed or programmatic workflow.
Why does my PDF look different from the webpage?
Print layout can change scale, pagination, backgrounds, and headers or footers. Check the preview and adjust print settings or print CSS.
Is a PDF destination the same as printing to a physical printer?
Both use print settings, but the options available depend on the selected destination. A paper size supported by one destination may not be available to another.
