← Back to blog

How to Screenshot Part of a Web Page in Chrome (Free, No Watermark)

September 12, 2026

Most screenshots are of one thing: a chart, an error message, a form, a paragraph someone needs to see. Capturing the whole tab and then cropping it later is the slow way, and the crop step is where people give up and send the full screen with an arrow drawn in a hurry.

Chrome does not have a built-in area screenshot on its own, but the operating system does, DevTools does in a roundabout way, and an extension can do it in the page itself with an editor attached. Here is each, and when to use which.

The keyboard shortcut (Windows and Mac)

On Windows, press Win + Shift + S. The screen dims, you drag the area, and the capture goes to the clipboard and a small Snip & Sketch notification. On a Mac, press Cmd + Shift + 4, drag, and the file lands on the desktop.

This is the right answer when you only need to paste the image somewhere immediately. It is the wrong answer when you need to blur a name out first, add an arrow, or keep a clean PNG -- the Windows editor is a separate app you have to open, and the Mac one is Preview.

DevTools, for a specific element

Right-click the thing you want, choose Inspect, then right-click the highlighted element in the Elements panel and choose "Capture node screenshot". Chrome saves exactly that element, including any part scrolled out of view.

It is precise and it is free, but it is three panels deep and it captures the element as laid out rather than the area you see, so a card with a hover state or an open dropdown usually comes out without it.

Drag the area in the page, then edit it

The extension route: press Screenshot in the Demorta bar (or Ctrl+Shift+8 when nothing is recording), the page dims, and you drag the area you want. A single click takes the whole visible page. The capture opens in an editor where you can crop again, blur, box, arrow and label it, then download a PNG with no watermark. Try the free screenshot tool.

The difference from the shortcut is that the edit happens before you leave. The difference from DevTools is that it captures what is on screen, hover states included, because it photographs the tab rather than re-rendering the element.

Which to use

  • Pasting into chat right now -- the OS shortcut. Nothing is faster.
  • One element, pixel-exact, possibly taller than the screen -- DevTools node capture.
  • Anything you will annotate, blur or send to a customer -- the extension, because the editor is where the time actually goes.
  • A whole scrolling page -- a dedicated full-page capture tool. Neither the OS shortcut nor the extension does scrolling captures.

Frequently asked questions

How do I screenshot only part of a web page in Chrome?
Use the operating system shortcut (Win + Shift + S on Windows, Cmd + Shift + 4 on Mac) and drag the area, or use a Chrome extension that lets you drag the area inside the page and edit the result before downloading. DevTools can also capture a single element via "Capture node screenshot".
Does Chrome have a built-in screenshot tool?
Only inside DevTools (Ctrl+Shift+P, then "Capture screenshot" or "Capture area screenshot"). There is no button in the normal browser UI, which is why most people use the OS shortcut or an extension.
How do I screenshot a web page without a watermark?
The OS shortcuts never add one. Among extensions, check the free plan specifically: several add a badge to free downloads. Demorta’s screenshot tool downloads a clean PNG on the free plan; it needs a free account and nothing else.

Keep reading

This is what Demorta does

Click through it — the same kind of demo you can record of your own product.

Try it on your own product

Record your first interactive demo free.

Five demos on the free plan, forever. No credit card, no trial countdown, no sales call. Install the Chrome extension, click through your product once, and you have a shareable link in about ten minutes.

Start free →