How to take full page screenshot in Chrome without extensions

| By
Learn how to take full page screenshot in Chrome without installing any extensions with built-in Developer Tools.

Earlier, capturing full page screenshot in Chrome was never easy. But, no more! With the latest version of Google Chrome (Chrome 59), you can easily capture full page screenshot in no time with built-in Developer Tools.

Capture full page screenshot using Chrome’s Developer Tools

There are two ways of doing this:

  • Using Device Mode
  • Using Command Menu

Using Device Mode

Here’s how to capture full page screenshot using Device Mode:

  1. Make sure you are running the latest version of Chrome (Chrome 59) by selecting Chrome’s Main Menu (three vertical dots) in the top-right corner > Help > About Google Chrome or going to chrome://help. This will force refresh an update. After updating, click Relaunch.
  2. Open DevTools by selecting Chrome’s Main Menu in the top-right corner > More tools > Developer tools. You can also open it by pressing Control+Shift+I in Windows & Linux or Command+Option+I in Mac. Alternatively, you can right-click on any part of the page and select Inspect to open DevTools from the menu displayed.
  3. Toggle device toolbar to enter the responsive Device Mode. You can also press Control+Shift+M in Windows & Linux or Command+Shift+M in Mac while focusing the mouse pointer on DevTools window.
  4. Specify your preferences (such as device type, etc.,) and select Capture full size screenshot in the More options menu.
Full page screenshot in Chrome using Device Mode.
Using Device Mode to capture full page screenshot.

Using Command Menu

Here’s how to capture full page screenshot using Command Menu:

  1. Open Chrome’s DevTools using the above steps.
  2. Press Control+Shift+P in Windows & Linux or Command+Shift+P in Mac to open the Command Menu.
  3. Start typing screenshot and select Capture full size screenshot. That’s it.
Full page screenshot in Chrome using Command Menu.
Using Command Menu to capture full page screenshot.

25 comments:

  1. Joe Smith

    If you have any elements that are sized using vh (viewport height), then the screenshot will be messed up.

  2. Aurelio Jargas

    Great post! Ctrl+Shift+P is what I was looking for. Did not know about it.

    I should mention that despite appearing a "mobile" tag before the command, it also works to take screenshot in the normal desktop view (not in device mode).

  3. Sally

    NOT WORKING! All you said above only leads to Chrome capturing the VIEWABLE screenshot, and definitely NOT the entire page as you state

      1. Mariia Chumakova

        I tried it with some websites – it did work. But with utest.com not. It only captures the viewable screenshot and that's it…

  4. george dark

    The Ctrl-Shift-P method works, the Device Mode one doesn't; no visible way to "set preferences", no visible way to get the menu shown in the post. Chrome on laptop, haven't tried it on smartphone

Leave a comment

Please post relevant comments to the topic discussed above! Spammy & irrelevant comments will be deleted. Happy commenting :)