Web Tips

How to Take a Full Page Screenshot in Chrome, Safari, Edge & Firefox

Need to capture an entire webpage — including content below the fold — without stitching multiple screenshots together? Every major browser has a built-in full page screenshot tool. Here's how to use each one.

How to Take a Full Page Screenshot in Chrome

Chrome's built-in screenshot tool is hidden in the developer menu. Here's the quick version:

  1. Open the page, then press Command + Option + I (Mac) or Ctrl + Shift + I (Windows) to open Developer Tools
  2. Press Command + Shift + P (Mac) or Ctrl + Shift + P (Windows) to open the Command Menu
  3. Type screenshot in the search bar
  4. Select Capture full size screenshot — Chrome saves it automatically to your Downloads folder

Note: This works best on content-heavy pages. On some web apps, it may only capture the visible viewport rather than the full page length.

Chrome with Custom Dimensions

To screenshot at a specific width or simulate a device:

  1. Open Developer Tools (Command + Option + I / Ctrl + Shift + I)
  2. Click the device toolbar icon (looks like a phone overlapping a tablet)
  3. Enter custom width and height in the dimensions bar above the responsive view
  4. Click the three-dot menu in the dimensions bar and select Capture full size screenshot

Full Page Screenshots in Other Browsers

Arc Browser

  1. Press Command + T
  2. Type capture full page and select it from the list

Images are saved to your Arc Library Media folder.

Brave Browser

Brave uses the exact same process as Chrome — Command/Ctrl + Shift + P then "Capture full size screenshot". Files save to your Downloads folder.

Microsoft Edge

Ctrl + Shift + S (Windows)  |  Command + Shift + S (Mac)
  1. Press the keyboard shortcut above
  2. Click Capture full page
  3. Click the Save icon (floppy disk icon) to download

Firefox

  1. Right-click the webpage and select Take Screenshot
  2. Click Save full page
  3. In the preview, click Download

Safari

First, enable the Develop menu if it's not visible: Safari → Settings → Advanced → Show features for web developers

  1. Click Develop in the menu bar, then Show Web Inspector (or Option + Command + I)
  2. In the Elements tab, right-click the line starting with <html
  3. Click Capture Screenshot and choose where to save

Pro Tips for Better Screenshots

Before You Capture

  • Clear browser cache to get the latest version
  • Disable extensions that might alter the page
  • Use incognito mode to avoid personalised content
  • Wait for all images and fonts to load

File Format Tips

  • PNG: best for pages with text and sharp edges
  • JPEG: better for image-heavy pages (smaller file)
  • Check the resolution matches your intended use
  • Crop in any image editor after capturing

When to Use Full Page Screenshots

  • Documentation — training materials, guides, knowledge bases
  • Design reviews — showing the complete layout and content flow
  • Bug reports — giving developers full context on an issue
  • Client presentations — showcasing complete website redesigns
  • Content archiving — preserving important web pages for reference

Alternative Tools

  • Loom — screen recordings with voiceover
  • Snagit — professional screenshot and annotation tool
  • Cleanshot X (Mac) — powerful capture tool with built-in editing
  • Greenshot (Windows) — free tool with annotation features

Need Help Building Your Website?

While you're here — create a professional website in under 60 seconds with AI. No coding required.

Build Your Website — from £29/year