ScreenshotNeo

BlogHow-to

How to Capture Website Screenshots for a Digital Agency Pitch Deck in India

Capture clear desktop, mobile, full-page, and detail views for a digital agency pitch deck, with a repeatable workflow and guidance on reuse.

By the ScreenshotNeo team4 October 20268 min read

For an agency pitch deck, capture the specific website pages and states that support your proposal, then choose the capture type that fits each slide: a viewport for the first screen, a full-page capture for page flow, an area or node capture for a detail, and a separate mobile viewport for responsive presentation. Keep the URL, date, viewport, zoom, scroll position, and page state consistent across comparisons. Chrome DevTools provides these capture options; its mobile Device Mode is an emulation, not a substitute for testing on a physical phone.

1. Plan the captures around the story

Start with the point each slide needs to make. A homepage overview rarely needs every page on the site, while a proposal about conversion may need the product or service page, pricing, contact path, or form.

  • Overview: capture the initial viewport of the homepage or key landing page.
  • Page flow: capture the full page when the length, sequence, or placement of content matters.
  • Specific detail: capture a region or selected element when the slide focuses on a menu, form, call to action, or other component.
  • Responsive view: capture a mobile-sized viewport separately and label it as simulated if it was made in Device Mode.
  • Before and proposed direction: distinguish the current-site evidence from agency mockups so the audience can tell what exists and what is proposed.

Make a short capture list before opening the browser. For each item, note the URL, the page state to show, the intended viewport, and the slide where it will appear. This helps avoid inconsistent screenshots collected in a rush.

2. Capture a website in Chrome DevTools

Visible viewport

  1. Open the target URL in Chrome and wait for the page to reach the state you want to show.
  2. Open DevTools. Select the device toolbar to enable Device Mode if you need a specific viewport.
  3. Set a consistent width and height, then capture the visible page using the DevTools screenshot command.
  4. Save the image with a filename that identifies the page and viewport, such as pricing-desktop-1440.png.

Full page

In DevTools, open the Command Menu, search for screenshot, and choose Capture a full size screenshot. This captures content beyond the visible viewport. Review the result for lazy-loaded sections, sticky elements, overlays, or other page behavior that could affect how the page appears. Chrome documents full-page capture alongside its other DevTools screenshot modes. Chrome DevTools: Capture screenshots

Area or selected element

To capture a region, open the Command Menu, search for screenshot, choose Capture area screenshot, then drag over the intended area. Chrome’s documentation notes that area capture does not work if DevTools is undocked. To capture a particular DOM element, select it in the Elements panel and choose Capture node screenshot. These are useful when a slide needs a page detail without turning the whole page into unreadable small text. Chrome DevTools screenshot instructions

Mobile viewport

Enable Device Mode and choose a named preset or enter a responsive width and height. Capture the viewport at the size you want to discuss. Chrome describes Device Mode as a first-order approximation of a mobile experience: it simulates a device from a desktop computer. If your proposal makes claims about how the site behaves on a particular handset, inspect it on a real phone as well. Label an emulated capture so it is not mistaken for a physical-device screenshot. Chrome: Simulate mobile devices with Device Mode

3. Make comparisons repeatable and easy to read

For every screenshot in a comparison, keep these conditions aligned where possible:

  • Same URL and page state, including the same menu, form, or consent state.
  • Same viewport width and height, browser zoom, and scroll position.
  • Same capture scope: compare viewport with viewport or full page with full page.
  • Capture date, especially when the deck may be shared later.
  • A clear distinction between a live site capture and an agency mockup.

Add a short caption under each image. For example: example.com/pricing · desktop · 1440 px · captured 4 Oct 2026 or example.com/pricing · mobile simulation · 390 px. Include the source URL and date in the caption or speaker notes where appropriate. These labels are practical editorial guidance, not an official capture standard.

Crop to direct attention, but preserve enough surrounding context to identify the page and the interaction. Do not edit the page content in a way that makes the image appear to show a feature, message, or state that was not present.

4. Automate repeat captures with Chrome Headless

For a recurring set of screenshots, Chrome Headless can write a screenshot from the command line. The following documented pattern requests a mobile-sized viewport:

chrome --headless --screenshot --window-size=412,892 https://example.com/

Use a consistent browser version and viewport for a comparison set. Confirm the output shows the intended page state and that images and other assets have loaded before using it in a client deck. A command-line capture is repeatable, but it does not guarantee that a page with dynamic content, consent overlays, or delayed assets will be in the same state on every run. Chrome Headless documentation

5. Use screenshots of other websites carefully

A page being publicly viewable does not automatically establish permission to reuse every part of it in a pitch deck. A website may include separate works such as text, software, photographs, graphics, and music. Check the site’s terms and rights notices, and seek permission where required. For a disputed or high-stakes use, get advice from qualified counsel; the applicable answer can depend on the material, purpose, terms, and how the deck is distributed.

India’s Presentation Gov portal says its own material may be reproduced after proper permission, should be reproduced accurately, should not be used in a derogatory or misleading context, and should be acknowledged. Its terms also exclude third-party copyrighted material unless permission is obtained from the rights holder. These are the portal’s terms, not a general ruling for every Indian website or every pitch deck. Presentation Gov: Terms of Use

IP India’s FAQ describes website content as potentially containing distinct kinds of works, including text, computer programs, photographs, graphics, and music. Treat this as a reason to check rights for the specific material rather than assume that one permission covers every embedded asset. IP India: Copyright FAQ

For public-sector websites, the Guidelines for Indian Government Websites and apps include accessibility guidance referencing WCAG 2.1, responsive presentation, and using actual text instead of images of text when the technology permits. This guidance is relevant to government sites and should not be described as a blanket legal mandate for every private business website. Guidelines for Indian Government Websites and apps

6. Or skip the browser setup

ScreenshotNeo is a website screenshot API and MCP server. One GET request returns an image or PDF, and its parameters also support common screenshot API naming, which can make switching straightforward. See the ScreenshotNeo API documentation.

curl -G "https://api.screenshotneo.com/v1/shot" -d access_key=YOUR_API_KEY --data-urlencode url=https://stripe.com -o shot.webp
import requests

r = requests.get(
    "https://api.screenshotneo.com/v1/shot",
    params={"access_key": "YOUR_API_KEY", "url": "https://stripe.com"},
    timeout=90,
)
open("shot.webp", "wb").write(r.content)
const q = new URLSearchParams({ access_key: 'YOUR_API_KEY', url: 'https://stripe.com' });
const res = await fetch(`https://api.screenshotneo.com/v1/shot?${q}`);
if (!res.ok) throw new Error(`Screenshot request failed: ${res.status}`);
await Bun.write('shot.webp', res);

Replace the example URL with a page you are permitted to capture. Cookie and consent banners are accepted like a visitor, and 60+ known consent platforms, newsletter popups, and chat widgets can be removed before capture; each step can be turned off. Bot checks, blank pages, timeouts, failed loads, and cache hits cost nothing, and response headers report the page verdict and billing status. Its MCP server provides take_screenshot, get_page_info, and capture_pdf for Claude, Cursor, and other MCP clients. 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, no card required.

7. Troubleshooting

Problem Likely cause What to do
Area screenshot command is unavailable DevTools is undocked, or the command label has changed. Dock DevTools and search for “screenshot” in the Command Menu. Chrome can update command labels over time.
Full-page capture misses content or shows placeholders Content may load on scroll, after a delay, or only after interaction. Scroll through the page first, wait for the intended content, and capture again. Inspect the saved image before adding it to the deck.
Mobile image is cropped unexpectedly The viewport dimensions or scroll position do not match the intended slide. Set the width and height explicitly, return to the intended scroll position, and capture again. Label the viewport size.
Two screenshots look different despite using the same URL Dynamic content, rotating banners, personalization, time-sensitive data, or a changed page state may differ. Record the capture date and state. Align the conditions where possible and describe any remaining difference in the slide.
Headless capture is blank or incomplete The page may not have finished loading or may rely on delayed assets or interaction. Check the output and page behavior, then capture after the required state is available. Do not treat the command’s completion as proof that the image is complete.
A deck image could imply a claim the page does not support The crop, annotation, or editing may remove context or alter how the original page appears. Retain enough context, use a factual caption, and keep mockups visibly distinct from captured evidence.

8. Performance, reliability, and cost

For a small pitch deck, manual DevTools capture keeps setup simple and lets you inspect each page state directly. For repeated sets, a command-line workflow reduces repetitive browser actions, but dynamic content still needs review. A physical handset adds fidelity when the proposal depends on device-specific behavior; emulation is useful for a consistent viewport, not proof of real-device behavior.

These methods use browser software and do not require dedicated capture hardware. Account for the time needed to choose representative pages, wait for content, review image completeness, label sources, and check reuse terms. The research sources provide no benchmark for capture speed or monetary savings, so no such estimate is implied here.

FAQ

How do I take a full-page screenshot of a website?

In Chrome DevTools, open the Command Menu, search for “screenshot,” and choose Capture a full size screenshot. Check the result for content that only appears after scrolling or interaction.

How can I show the mobile version of a website in a pitch deck?

Use Device Mode with a named preset or a responsive width, capture the viewport, and label it as a mobile simulation. Use an actual phone when the point depends on real-device behavior.

Can I use screenshots of another company’s website in a proposal?

Check the site’s terms and rights notices and consider the rights in embedded assets. Public access alone does not settle permission; get qualified legal advice for a high-stakes or disputed use.

Should I put the source URL on the slide?

Where appropriate, include the source URL and capture date in a caption or speaker notes so the audience can identify the page and when it was captured.