Cool Easy

← All articles

How to crop and resize a screenshot without opening Photoshop

A screenshot that needs cropping doesn't require a design tool — it requires a crop tool. Here's one that lives in your browser and takes five seconds to use.

20 May 2026 · 2 min read

The overhead of the wrong tool

Most people's workflow for cropping a screenshot looks something like: take screenshot, open Finder, find screenshot, open Photoshop or Preview or Figma, wait for the app, crop, export, find the exported file, rename it, use it.

That's four minutes of tool overhead for a task that takes five seconds of actual work. And it interrupts whatever you were doing before the screenshot was needed.

The alternative is a crop tool you can access in two seconds without switching applications — one that lives in your browser and requires nothing beyond dragging in the image and dragging a selection box.

The system

Step 1: Take or locate the screenshot

Take the screenshot normally — the OS screenshot tool, a browser screenshot extension, or an image you've received from someone else. Note where it saved (usually the Desktop or Downloads folder).

Step 2: Open the crop tool in Toolbelt

Install Toolbelt and open it from the Chrome toolbar. Select the Image Crop tool from the side panel. Drag the screenshot from your Desktop or Downloads folder directly onto the drop area. The image loads immediately — no upload, just the browser reading the file.

Step 3: Set the crop selection

Drag to select the area you want to keep. The rest will be discarded. If you need specific dimensions:

For most cases — removing UI chrome from a screenshot, cutting to just the relevant portion — a freehand crop is faster.

Step 4: Resize if needed

After cropping, resize the result if the target dimensions are different from the crop dimensions. For example: crop to the region of interest, then resize down to 1200px wide for embedding in a document.

Doing crop then resize in that order is more efficient than the reverse — you avoid resizing pixels that will get discarded by the crop.

Step 5: Download

Select the output format and download. For documents: PNG. For web: WebP or JPEG. The file goes directly to your downloads folder.

Common mistakes

Resizing before cropping. If you resize a 3000px image to 800px and then crop it, you've scaled down all the pixels you're about to discard. Crop first, then resize the result.

Using JPEG for screenshots with text. JPEG's lossy compression introduces blur and artefacts around sharp edges — exactly what text and UI elements have. PNG or WebP preserves them cleanly.

Over-engineering a one-off task. If you need to crop one screenshot for one purpose, a browser tool is the right level of tool. If you need to crop 50 screenshots consistently — for documentation, a tutorial, a product landing page — a template in Figma or a batch script is more appropriate.

FAQ

What's wrong with using the macOS Screenshot tool's built-in crop?

The built-in screenshot crop at capture time is excellent — if you use it, great. The browser tool is useful when you have an existing image that needs cropping after the fact — a screenshot you took earlier, an image someone sent you, a downloaded graphic that needs trimming. It's also useful when you need to crop to specific pixel dimensions rather than a freehand selection.

Can I crop to an exact aspect ratio?

Yes. When cropping in Toolbelt, you can set an aspect ratio lock — 16:9, 1:1, 4:3, or a custom ratio — and the crop selection will constrain to that ratio. This is useful for preparing images for specific social media formats, presentation slides, or thumbnails with fixed dimensions.

What file format should I save the cropped screenshot in?

For screenshots of UIs, text, or anything with sharp edges and flat colors, PNG is the right choice — it preserves the sharpness that JPEG compression would blur. For screenshots going into a web page (not a document), WebP at 90+ quality is smaller than PNG with no visible difference. JPEG is a reasonable third option but tends to produce visible artefacts on text and UI screenshots.

Is there a way to annotate the screenshot (add arrows, highlight areas) before saving?

Not in Toolbelt — it's a pure crop/resize/convert utility, not an annotation tool. For annotation, macOS's built-in Markup (in Preview or the screenshot tool), Skitch, or CleanShot X are the tools to use. Annotate first, crop second.