How to capture a full-page screenshot with HTMLCSStoImage
Capture an entire page with HTMLCSStoImage by setting `full_screen=true`. Learn how to choose a viewport, handle long pages, and fix common capture issues.
To capture the entire scrollable page with HTMLCSStoImage, send the URL with full_screen=true. The flag defaults to false, which captures only the viewport. For example:
curl -X POST https://hcti.io/v1/image -u 'UserID:APIKey' \
--data-urlencode url="https://example.com/long-page" \
--data full_screen=true
The API can also accept a JSON request with {"url":"https://example.com/long-page","full_screen":true}. The hosted renderer must be able to reach the URL; it cannot access your local localhost page.
1. Send a full-page capture request
Use your HTMLCSStoImage User ID and API key for HTTP Basic Authentication, then provide the publicly reachable URL and set the full-page flag. The following request follows the documented form:
curl -X POST https://hcti.io/v1/image -u 'UserID:APIKey' \
--data-urlencode url="https://example.com/long-page" \
--data full_screen=true
Replace the example credentials and URL with your own. URL-encoding the address helps when it contains query parameters or other special characters. A request that leaves out full_screen uses the documented default, false.
2. Set the viewport and output for the page
The viewport controls the browser layout and responsive breakpoint. The documented default is 1920 × 1080. A full-page result can extend beyond the viewport height because it captures the scrollable page; the viewport height is not a cap on the full-page image.
- Responsive layout: choose a viewport width that matches the desktop or mobile layout you want to capture. Width affects which responsive CSS breakpoint the page uses.
- Viewport dimensions: when specifying either
viewport_widthorviewport_height, provide both. The viewport reference documents a maximum width of 6000 CSS pixels. - Mobile rendering: use the documented mobile viewport option when you need a mobile-style rendering.
- Pixel density: use
device_scaleto control device pixel ratio. The documentation gives an example where a 1000 × 1000 CSS-pixel viewport at scale 1.5 produces a 1500 × 1500 image. - Output format: the parameter reference lists PNG, JPG, WebP, and PDF. Select the format that fits the next step in your workflow.
Very tall pages can produce large images. The general parameter reference also describes jumbo dimensions up to 80,000 pixels in width and height when both dimensions are supplied, with additional image credits consumed. Check the current account conditions before relying on those limits; they are not necessarily available for every plan or capture mode.
3. Choose full-page capture or a selector
Use full_screen=true when you need the whole scrollable page. If you need only one section or component, use the selector parameter to capture that element instead. The vendor describes selector capture as a potentially faster, smaller-file option for very long pages; no benchmark timings or guaranteed savings are published in the research.
Do not confuse this URL-capture behavior with HTML snippet sizing. The sizing guide says HTML snippets are auto-cropped to their outermost element, while URL screenshots and full HTML pages use a viewport. It also documents generated HTML/CSS images as rendering at 2× by default.
4. Handle page readiness and consent banners
Some pages fill in content after the initial HTML loads. HTMLCSStoImage documents ms_delay and render_when_ready as timing controls for content that needs additional time. Their effect depends on the page; the research did not test them against particular sites. Use them when you have evidence that your target page renders late, and avoid assuming they will resolve every dynamic-content issue.
The URL screenshot options include block_consent_banners, which is documented to dismiss most cookie popups. Do not assume it handles every consent interface. If a banner remains, investigate whether the target uses a supported interface or whether a different capture configuration is needed.
5. Check access to the target URL
The hosted renderer needs network access to the page. A URL such as http://localhost:3000 refers to the renderer’s own environment, not your computer, so it cannot reach a local development server. Make the page reachable to the renderer through an appropriate deployment or configured proxy.
For protected pages, the docs describe custom request headers or a configured proxy. A hosted capture does not automatically perform an interactive login flow. Some sites may also block automated access, so a valid URL alone does not guarantee a successful render.
6. Diagnose common capture problems
| Symptom | Likely cause | What to check |
|---|---|---|
| Only the first screen appears | full_screen was omitted or set to false. |
Pass full_screen=true in the request body or JSON boolean. |
| The URL cannot be captured | The renderer cannot reach the address, including a local localhost URL. |
Confirm the page is publicly reachable from the hosted renderer or configure an appropriate proxy. |
| A protected page shows an access or login screen | The capture does not complete an interactive login flow. | Use supported custom headers or a configured proxy for pages you are authorized to access. |
| Content below the fold is missing or incomplete | The page may load content after the capture is ready. | Try the documented readiness or delay controls, render_when_ready or ms_delay, and inspect whether the site blocks automated access. |
| The layout looks like the wrong device | The viewport width selects a different responsive breakpoint. | Set both viewport dimensions and choose a width matching the intended desktop or mobile layout. |
| A cookie banner obscures the page | The site’s consent interface may not be handled by the banner option. | Try block_consent_banners, which targets most cookie popups, and verify the rendered result. |
| The capture is unexpectedly large | A full-page image includes the whole scrollable height, or a high device scale increases pixel dimensions. | Capture a specific element with selector if the whole page is unnecessary; review viewport and scale settings. |
7. Consider performance, reliability, and cost
Full-page capture has to render the page’s scrollable content, so long pages can take more work and produce larger files than a single-element capture. The documentation recommends selector capture as a potentially faster and smaller alternative for a particular component on very long pages, but it provides no measured time or file-size comparison.
For repeatable results, keep the URL, viewport, output format, scale, and readiness settings explicit. A changing page, delayed content, network restrictions, or automated-access blocking can affect what the renderer sees. The research dossier does not establish a price, quota, timing guarantee, or service-level commitment for HTMLCSStoImage, so check its current official documentation and account terms for those details.
Or skip the browser setup
ScreenshotNeo provides a website screenshot API and MCP server. One GET request can return a PNG, JPEG, WebP, or PDF. Its API also supports full-page capture with lazy images loaded. See the ScreenshotNeo API docs for request options.
curl -G "https://api.screenshotneo.com/v1/shot" -d access_key=YOUR_API_KEY --data-urlencode url=https://example.com/long-page -o shot.webp
import requests
r = requests.get(
"https://api.screenshotneo.com/v1/shot",
params={"access_key": "YOUR_API_KEY", "url": "https://example.com/long-page"},
timeout=90,
)
open("shot.webp", "wb").write(r.content)
const q = new URLSearchParams({
access_key: 'YOUR_API_KEY',
url: 'https://example.com/long-page'
});
const res = await fetch(`https://api.screenshotneo.com/v1/shot?${q}`);
ScreenshotNeo accepts cookie and consent banners, removes more than 60 known consent platforms, newsletter popups, and chat widgets before the shot, and lets you turn each step off. Bot checks, blank pages, failed loads, timeouts, and cache hits are not billed; response headers report the page verdict and billing status. Its MCP server lets AI agents use take_screenshot, get_page_info, and capture_pdf. The free plan includes 1,000 screenshots a month with no card; paid plans start at $5 for 3,000 screenshots.
Sign up for 1,000 free screenshots a month, with no card required.
FAQ
Does full-page mode change the viewport height?
No. The viewport sets the browser’s layout dimensions; full-page mode can return an image taller than the configured viewport height.
Can I capture just one section?
Yes. Use the documented selector option when you need a particular element instead of the entire page.
Can HTMLCSStoImage capture a page on my computer?
Not through a localhost URL from the hosted renderer. The renderer needs a network-reachable address, or an appropriate configured proxy.
Which formats are documented?
The parameter reference lists PNG, JPG, WebP, and PDF.


