Screenshots guide

1. Getting started

Open a screenshot in any of these ways: Choose a picture (pick up to four at once), paste one with Ctrl+V, drop files on the page, or Capture screen on a computer (below). Try a sample opens a made-up dashboard to play with.

Pasting or dropping a picture while one is open asks first: Add as a layer (on top of this screenshot), Replace the screenshot, or Cancel.

Pick up where you left off: the screenshots you are working on, with everything drawn on them and how they are framed, are kept in this browser. Next time the empty page offers them: Open brings them back, Forget throws them away. Only the work in hand is kept, not a list of past ones.

The Clear or start again button in the top bar (the bin; ⋯ on a phone) has Clear drawings (keeps the screenshot; Undo brings them back) and Start over (removes the screenshot and everything on it).

2. Capture screen

On a computer, Capture screen (on the empty page, and as Capture screen… in Design › Screenshots) takes a screenshot without leaving the page. Choose a wait first: At once, 3 s, 5 s or 10 s (kept for next time), then Choose what to capture. Your browser asks which window, tab or whole screen to share. During the wait a countdown shows; switch to the window you want and open any menu you want in the picture. One picture is taken, sharing stops at once, and the picture opens here.

From the Screenshots section the capture joins the screenshots already open (up to four; with four it asks whether to add it as a layer or replace). Phones and tablets can't share their screen with a web page, so the button isn't shown there: take the screenshot with the phone's own buttons and open it.

3. The screen

• Top bar: PixelDodo (back to the home page), Open (another screenshot, starting afresh), Add another (one more beside it), undo and redo, Clear or start again, the keyboard button (every shortcut), Copy, Share (where the device can share files) and Download with its ▾ for the file type and size.
• Tools down the left (along the bottom of the picture on a phone). Buttons with a small corner triangle hold several tools: Shape (rectangle, ellipse, line, cover box) and Hide (blur, blur by hand, erase). The one shown is the one you used last.
• The sidebar has three tabs: Draw (colour, size and the choices of the item or tool, then Layers), Design (everything about the frame and background, with a row of icons to jump to a section) and Export. Sections fold with their heading; a folded one says what is set. Drag the sidebar's left edge to make it wider (double click: back), or hide it with \.
• Zoom: Ctrl+wheel or pinch, the − / % / + bar, Fit and 1:1 (actual pixels). Move about with Space+drag, the middle mouse button, or two fingers.

4. Drawing tools

Pick a tool, then drag on the screenshot (text, steps, emoji and stamps: click). After drawing, the tool stays in hand for the next one; press V or Select to pick and move things.

• Arrow (A): Straight, Curved, Two heads or Dashed. Line (L). Hold Shift for straight across, up or at 45°.
• Rectangle (R) and Ellipse (O): Outline or Tinted. Shift makes a square or a circle.
• Pen (P) draws freehand; Highlighter (H, "Marker" on a phone) is wide and see-through.
• Text (T): click and type; Shift+Enter starts a new line, Esc or a click elsewhere ends it. Outlined (readable on anything) or Label (on a filled box). Typeface (Sans, Serif, Mono, Hand, only fonts your device has), line up left / centre / right, and Bold (Ctrl+B). Double click a text to change its words.
• Callout (K): drag from what it points at to where the label goes, then type.
• Magnifier (M): a round lens showing what's under it at twice the size. Spotlight (S): dims everything outside its box; several can overlap.
• Pick a colour (I): click the picture to take that colour, then you are back on the tool you had.

Colour: eight swatches, the colours you used lately, any colour, a hex box and (in Chrome and Edge) a picker for anywhere on your screen. Size: Small, Medium or Large, sized to the screenshot so they look the same on a small and a huge one, and Fine tune (40–300%) on top.

5. Hiding things: blur, cover, erase

Use these on passwords, emails, names and anything else that shouldn't be seen. All three are in the Hide button.

• Blur (B): drag a box. Pixelate (big squares) or Soft blur.
• Blur by hand (F): draw round what to hide, like a lasso; what's inside the line is blurred. Pixelate or Soft blur.
• Erase (W): drag a box over something and it is filled with the colours just outside it, as if it were never there. Good for a word or an icon on a plain or shaded background; on a busy one (a photo), use blur or a cover box.
• Cover box (X, in the Shape button): a solid box in the colour you choose.

Blur, the magnifier and erase see what lies under them: the screenshot and the items below them in the Layers list. A blur over an erased part shows the erased part, not what was there. The download is made from the covered picture, so what's hidden can't be got back from the file.

6. Steps, emoji and stamps

• Numbered step (N): click to place 1, 2, 3… They number themselves in order, so deleting one renumbers the rest. Count from sets the first number.
• Emoji (E): pick one of 24, then click.
• Stamp (G): a tick, a cross, a question mark, a star, New, Bug and Fixed badges, a mouse pointer and a tap (a finger's touch), for how-to pictures and bug reports. They take the colour you choose (the mark on them turns dark on a light colour) and can be resized and turned like the other items. Picking another stamp while one is picked changes that one.

7. Measure

Measure (D): drag from one point to another and it shows the distance in the screenshot's own pixels, with a bar across each end. A slanting one also says how far across and down (for example "212 px (150 × 150)"). Hold Shift to keep it level, upright or at 45°; drag its ends to change it. It is drawn on the download like any other item, so hide it in Layers if it was only for you.

8. Picking, moving and changing items

• Pick with Select (V): click an item; Shift+click adds or removes one; drag across empty space to pick everything the box touches; Ctrl+A picks all.
• Move by dragging or with the arrow keys (Shift: 10 pixels). Items line up with the screenshot's edges and middle and with each other (blue guides); Alt moves freely.
• Resize with the corner handles (several picked: the handles of the box round them all), and turn boxes, texts, steps, emoji, stamps and pictures with the handle above them.
• The bar over the picked item (on a phone, along the top of the picture) has its colour, size, style, Duplicate, front / back, Delete and ⋯. A right click (on a phone, holding the item) opens a menu: Copy, Paste, Duplicate, Bring to the front, Send to the back, Group or Ungroup, Straighten, Lock, Hide and Delete (on empty space: Paste, Select all, Fit the picture, Actual pixels, Copy the picture, Download).
• Opacity in the Draw tab makes an item see-through. Ctrl+C / Ctrl+V copy items, even onto another screenshot; with nothing picked, Ctrl+C copies the whole picture.

9. Layers and groups

Layers (in the Draw tab) lists what is drawn on the screenshot in hand, top first, with the screenshot itself at the bottom. Click a row to pick it (Shift / Ctrl: with the others), drag rows to change the order (on a phone, by the grip), double click a name to rename it. Each row can be hidden (not drawn or downloaded), locked (the picture leaves it alone), duplicated or deleted.

Add picture… puts a picture (a logo, a second screenshot) on top as a layer; it keeps its shape as you resize it (Shift: freely). Group (Ctrl+G) ties the picked items together so they move as one; a group can be folded, renamed, hidden and locked in the list. Ungroup: Ctrl+Shift+G.

10. Crop, rotate and flip

Crop (C) shows the whole screenshot with a box to drag; pick a shape (Free, Original shape, 1 : 1, 16 : 9, 4 : 3, 4 : 5, 9 : 16) to keep it in proportion. Apply (Enter) or Cancel (Esc). A crop can always be widened again: Show the whole picture puts it all back. ↺ Left, ↻ Right and ⇋ Flip turn or mirror the screenshot with everything drawn on it (words stay readable).

11. Looks and frames

Looks (Design tab) set the frame, background, spacing and shadow in one click: Gradient, Clean, Glass, Night, Browser, Phone, Plain and App Store (a phone on a gradient at the App Store's iPhone size, with room for a heading). Save this look… keeps your own (in this browser); its × removes it.

Frame: None, Window, Browser and Dark browser (with the Address in the bar you type), iPhone, Android, Tablet, Laptop, Monitor and Watch. A device keeps a real device's shape: a screenshot that isn't the shape of its screen sits Whole in the middle, or Fill covers the screen (crop it to choose what shows). Frame style adds a tray round a plain frame, window or browser: Glass, Dark glass, Inset, Dark inset, Outline or Border.

12. Layout: lean, tip and off the edge

Layout has ready-made ones (Flat, Left, Right, Hero, Lying back, Tipped, Off the bottom, Off the corner, Cards) and the parts they are made of: Lean (Flat, Left, Right, Back or Forward, in real perspective) and How far, Tip (turned on the page like a card on a table), Off the edge (the frame runs off the bottom or the corner) and Cards behind it.

13. Background, spacing and shadow

• Background: gradients (turn one with the direction buttons), mesh gradients, plain colours, the screenshot itself blurred, your own picture, none (see-through, for a PNG or WebP) or any colour. From this screenshot's colours offers backgrounds made from its own colours. Grain adds specks to the background only.
• Spacing: Space around, Round corners and Shadow, with three kinds of shadow: Spread (soft and wide), Hug (tight) and Adaptive (in the screenshot's own colour). Double click a slider to put it back.

14. Several screenshots

Up to four screenshots go in one picture: Add another… in Design › Screenshots (or the top bar), choose several files at once, or Capture screen…. Click one on the picture, or its number chip, to work on it; drag a chip to change the order; Remove this one takes it out. Each has its own frame, crop and drawings.

Arrangement: Side by side, Stacked, Overlapping, Fanned or Before / after (next section), and Space between. Labels on the screenshots puts a word in a dark pill in the corner of each: Before and After for the first two unless you type This one's label (empty: no label).

A social post holds one screenshot, so the posts are off while there are several.

15. Before and after

Before / after (in the Screenshots section's Arrangement) lays the first two screenshots one over the other in the same frame: the first shows left of a line, the second right of it, with a round knob on the line. Where it splits moves the line across (5–95%) and Slant leans it (up to 30° either way). With Labels on the screenshots, Before sits top left and After top right. A third or fourth screenshot isn't shown in this arrangement.

For a fair comparison, crop both to the same part first.

16. Stitch scrolled screenshots

Stitch into one picture… (Screenshots section, with two or more open) joins them into one long picture: Top to bottom (a scrolled page or chat, the usual for tall screenshots) or Side by side.

For screenshots taken while scrolling, it finds where each one repeats the one before and cuts the repeated part, and it notices a bar that is the same at the top (a header) or the bottom (a tab bar) and keeps it only once. The preview shows the joins as dashed lines. Each join has two sliders: where the first one ends and where the next one starts (in pixels), to fix a join it got wrong or to cut more when it found none. Stitch puts the joined picture in place of them, with everything drawn on them carried over; Undo brings the separate screenshots back.

Screenshots of different widths are sized to the first one's width. A joined picture longer than 16,384 pixels is made smaller to fit.

17. Title, watermark and effects

• Title: a Heading and a Line under it on the background, above or below the frame, centred or left, small, medium or large, in white, black or chosen from the background. With several screenshots, Heading for this screenshot alone gives each its own heading for Download each screenshot on its own: a set of app store screenshots, each saying something different.
• Watermark: your name or site and / or a logo in a corner, small to large. Kept in this browser and put on every picture until you clear it.
• Effects: Light and shadow falling across the picture (Window, Blinds, Leaves) and an effect Over the picture (Noise, VHS, Glitch), each with a strength.

18. Social posts

Social post puts the screenshot in a post drawn in the layout of X, Instagram, LinkedIn, Threads, Facebook or WhatsApp (generic icons, no logos): light or dark, your name, handle and words, the numbers under it, a tick, and for some a date, a reply or their message above yours. A profile picture can be picked; it isn't kept. The name, handle and theme are remembered, the words are not.

19. 3D shapes

3D shapes scatters shiny shapes on the background (Spheres, Rings, Blocks, Mixed) in colours taken from it: How many and Shuffle, then size, material and colour. With Select, drag a shape to move it, use its handles to size and turn it, and put it in front of the frames or behind them. Buttons below add one shape at a time.

20. Picture shape and app store sizes

Picture shape (Design tab) is Auto (fits the screenshot), a ratio (16 : 9, 1.91 : 1 for link previews, 2 : 1, 3 : 2, 4 : 3, 1 : 1, 4 : 5, 9 : 16 for stories) or an exact size: Your own size… in pixels, or one of the stores' own:

With an exact size, a 1x download is exactly that many pixels (2x: twice). The background grows to fill the shape. A set of store screenshots: open up to four, choose the App Store look (or a phone frame and a store size), give each its Heading for this screenshot alone, then Download each screenshot on its own. Check the stores' current rules before you send them in.

21. Download, copy and share

Download (Ctrl+S) saves the picture. Its ▾, and the Export tab, choose the file type (PNG, JPG or WebP, with a quality slider for the last two; a JPG can't be see-through, so it gets white behind it), the size (1x, 2x or a width you set) and a file name. The zoom bar shows the download's size. Copy puts a PNG on the clipboard; Share hands it to another app where the device can. With several screenshots, Download each screenshot on its own makes one file per screenshot with the same look (your browser may ask once to allow several downloads).

22. On a phone

• The tools are a row under the picture with a name under each; slide it sideways for the rest. Settings at its start shows or hides the sheet with the tabs.
• Drag the sheet's grip to make it taller or shorter; a tap tucks it down or brings it back.
• Pinch to zoom and move with two fingers. Hold an item for its menu. The picked item's bar sits along the top of the picture.
• Phones can't share their screen with a web page, so Capture screen is only on computers.

23. Keys

Press ? in the editor for the full list. On a Mac, Ctrl is ⌘.

24. Good to know

• Nothing is uploaded, and the page fetches nothing from other sites. A captured screen goes straight from your browser into the page.
• A download can be up to 16,384 pixels a side and 120 megapixels; a bigger one asks you to choose a smaller size.
• Undo keeps the last 100 steps.
• Your choices (frame, background, colour, size, download type, saved looks, the watermark and its logo) are kept in this browser too; the words of titles and posts are not.