# Screenshot.Rocks: full text of guides and tool pages ## Screenshot mockup generator URL: https://screenshot.rocks/screenshot-mockup-generator/ Updated: 2026-09-24 Drop in a screenshot and get a finished mockup: a browser window or an iPhone, a background, a soft shadow, and an image at the size you need. The device frame is an iPhone; there are no Android, iPad or laptop frames. Open the editor Free · No account · No watermark What you can make Browser window Six styles (Light, Dark, Black, Soft, Square, Plum) or your own colors. Type any address into the address bar, or hide it. iPhone Five finishes, the Dynamic Island on or off, and a choice of which part of a tall screenshot shows on the screen. Just the image No device at all: rounded corners, a shadow and an optional hairline outline, for components and cropped details. How it works Add your screenshot. Drop it on the editor, choose a file, or paste it with ⌘+V (Ctrl+V on Windows). You can also capture a website from its URL. Pick a frame. Landscape screenshots go into a browser window and portrait ones into an iPhone automatically. Switch any time. Choose a background. A solid color, a gradient, one of the background images or your own, or nothing at all for a transparent PNG. Set the canvas. One click for 16:9, 4:3, 1:1, 4:5 or 9:16, or type an exact width and height up to 2300 px. Drag the screenshot to move it, drag a corner to resize it, and tilt it if you like. Export. Download a PNG, JPEG, WebP or SVG, or copy the image straight to your clipboard. Try it on your own screenshot Free, no account, and your images stay in your browser. Open the editor Export formats | | Format | Best for | Transparent background | PNG | Docs, slides and anything with small text. Lossless, so text stays sharp. | Yes | JPEG | Small files, for social posts and email. | No (white) | WebP | Websites. Smaller than PNG at similar quality. | Yes | SVG | Places that require an SVG file. It contains the finished image, so it won’t get sharper when scaled up. | Yes The exported image is exactly the canvas size you set, so a 1600 × 900 canvas gives you a 1600 × 900 file. See screenshot sizes for each platform for which size to pick. Add notes, arrows and blur Turn on Markup to draw boxes, ellipses and arrows, add numbered steps, write text in one of ten fonts, or blur anything private. Markup is part of the exported image. A headline, a highlighted card and a numbered step, all made in the editor. Where your images go Screenshots you add are processed in your browser and are not uploaded or stored. Two features do use the server: capturing a website sends the URL to be rendered, and the browser extension passes the captured tab to the editor. Neither keeps a copy. The code is open source if you want to check. Frequently asked questions Q: Is the screenshot mockup generator free? A: Yes. There is no account, no watermark and no limit on exports. Q: Are my screenshots uploaded to a server? A: No. Images you drop, choose or paste are processed in your browser. Only the optional website capture and the browser extension send a web address or a screenshot to our server, and neither is stored. Q: Can I make a mockup with a transparent background? A: Yes. Set the background to None and export a PNG or WebP. JPEG doesn’t support transparency, so it uses white. Q: What size should my mockup be? A: Use the size the image will be shown at: 1600 × 900 for X, 1080 × 1350 for a portrait LinkedIn or Instagram post, 1200 × 630 for link previews. The sizes guide lists more. Q: Can I use it for App Store or Google Play screenshots? A: For Google Play, yes: a 1080 × 1920 canvas works for phone screenshots. Apple requires iPhone screenshots larger than the editor’s 2300 px maximum, so it can’t make App Store screenshots. --- ## Take a mobile screenshot of any website URL: https://screenshot.rocks/mobile-website-screenshot/ Updated: 2026-09-24 You don’t need a phone to capture a website’s mobile layout. Enter the address and get a phone-sized screenshot in an iPhone frame, or use your browser’s device mode for pages behind a login. Capture a mobile screenshot Free · No account From a URL, in a few seconds Open the editor. Under Or capture a website, type the address, for example example.com. Tick Mobile and press Capture. The screenshot opens in an iPhone frame. Pick a background and export. The capture loads the page the way an iPhone would: a 375 × 812 point screen (the size of an iPhone X) at 3× pixel density, with an iPhone browser identity, so sites serve their mobile layout. The image is 1125 × 2436 pixels. The online capture shows the first screen of the page, not the whole scrolling length. It can’t see pages behind a login, local sites like localhost, or sites that block automated browsers. Use one of the methods below for those. Try it on your own screenshot Paste a URL, tick Mobile, and the result opens in an iPhone frame. Open the editor In Chrome or Edge, with device mode Device mode works on any page you can open, including ones behind a login, and can capture the full scrolling height. Open DevTools with F12, or ⌘+⌥+I on a Mac. Press ⌘+⇧+M (Ctrl+Shift+M on Windows) to turn on the device toolbar. Choose a phone from the Dimensions menu, such as an iPhone, or type a width. Reload the page so the site serves its mobile version. Open the ⋮ menu at the right of the device toolbar and choose Capture screenshot for the visible screen or Capture full size screenshot for the whole page. The PNG goes to your Downloads folder. The screenshot uses the device’s pixel ratio, so an iPhone preset gives a 3× image. If you typed a custom width, choose ⋮ → Add device pixel ratio and set DPR to 2 or 3 to avoid a blurry result. In Firefox Press ⌘+⌥+M on a Mac or Ctrl+Shift+M on Windows to open Responsive Design Mode. Pick a device from the menu at the top and reload the page. Click the camera icon in the toolbar to save a screenshot of the phone-sized viewport. In Safari Turn on developer features: Safari → Settings → Advanced, then tick Show features for web developers. Choose Develop → Enter Responsive Design Mode and pick an iPhone. Press ⌘+⇧+4 and drag over the phone preview to capture it. On the phone itself If you have the phone to hand, a real screenshot is the most accurate. On an iPhone press the side button and volume up together; on most Android phones press power and volume down. Send it to your computer with AirDrop, Quick Share or email, then drop it into the editor. The iPhone frame guide covers the rest. Tips for a better mobile screenshot Dismiss cookie banners and app-install prompts before capturing. They cover a large part of a small screen. Check dark mode too. In Chrome DevTools, open the Rendering panel and set Emulate CSS media feature prefers-color-scheme to dark. Pick one part of the page. A mobile screen shows a lot less than a desktop one, so capture the section that matters rather than the top of the page by default. Use a 4:5 or 9:16 canvas for social posts so the phone fills the frame. See screenshot sizes. Frequently asked questions Q: What screen size does the mobile capture use? A: 375 × 812 points at 3× density, the screen size of an iPhone X, which gives a 1125 × 2436 pixel image. Q: Can I capture the full length of a page in its mobile layout? A: Yes, with Chrome or Edge device mode: choose Capture full size screenshot from the device toolbar’s ⋮ menu. The online capture only takes the first screen. Q: Why does the site still show its desktop layout? A: Reload the page after turning on device mode; some sites only check the screen size when the page loads. If it still shows the desktop layout, the site may not have a mobile design. Q: Can I capture a page that needs me to log in? A: Use device mode in your own browser, or the browser extension. The online capture runs on a server that isn’t logged in to your account. --- ## Website screenshot generator URL: https://screenshot.rocks/website-screenshot/ Updated: 2026-09-24 Type a URL and get a sharp screenshot of the first screen of the page, already in a browser window with the address filled in. Choose a background and export it. For the whole scrolling page, see full-page screenshots. Capture a website Free · No account How to capture a website Open the editor. Under Or capture a website, type the address. You can leave out https://. Tick Mobile if you want the phone layout. Otherwise you get the desktop layout. Press Capture. The page opens in a browser frame with its address in the address bar. Choose a frame style and background, then export. Try it on your own screenshot Free, no account, and your images stay in your browser. Capture a website What the capture includes | | Layout | Browser window | Image size | Desktop | 1440 × 800, at 2× density | 2880 × 1600 px | Mobile | 375 × 812 (an iPhone), at 3× density | 1125 × 2436 px The capture is the first screen of the page, the part a visitor sees before scrolling. That is usually what you want for a mockup; a full-length page is very tall and shrinks to unreadable when framed. The capture runs on a server that loads the page as a first-time visitor, so it can’t see anything behind a login, local addresses like localhost, or sites that block automated browsers. When to capture the page yourself Your own browser can capture things the online tool can’t. Take the screenshot yourself, then drop it into the editor, when you need: The whole page. Every major browser can do this without an extension. See how to take a full-page screenshot. A logged-in page, like a dashboard or settings screen. The browser extension captures the tab you’re on in one click. A particular state, such as an open menu, a filled-in form or a hover effect. A local or staging site that isn’t public. Common uses Launch posts and changelogs. A framed screenshot on a soft background reads as a finished image in a feed. Portfolios and case studies. Keep every project in the same frame and background so the set looks consistent. Proposals and pitch decks. Export at 1920 × 1080 for a full-width slide. Documentation. A browser frame makes it obvious the image is a web page, not part of the docs themselves. Frequently asked questions Q: Does it capture the full page? A: No, it captures the first screen. For the full length, use your browser’s built-in capture; the full-page screenshot guide shows where it is in Chrome, Firefox, Edge and Safari. Q: Can I capture localhost or a staging site? A: Not with the online capture, because the server can’t reach it. Use the browser extension or take a screenshot and drop it into the editor. Q: Why did the capture fail? A: Usually the address is mistyped, the site took too long to load, or it blocks automated browsers. Check the address and try again, or capture it yourself. Q: Is the captured page saved anywhere? A: No. The screenshot is sent back to your browser and isn’t stored on the server. --- ## Screenshot extension for Chrome, Firefox and Edge URL: https://screenshot.rocks/screenshot-extension/ Updated: 2026-09-24 Click the toolbar button on any page and the visible part of the tab opens in the editor, already in a browser frame. Because it runs in your own browser, it works on dashboards and other pages behind a login. Add to ChromeChrome Web Store Add to FirefoxFirefox Add-ons Add to EdgeEdge Add-ons How it works Install the extension for your browser from one of the stores above. Pin it so the button is always visible. In Chrome and Edge, click the puzzle-piece Extensions icon and then the pin next to Screenshot.Rocks. In Firefox, open the Extensions menu and choose Pin to Toolbar. Open the page you want and click the Screenshot.Rocks button. The editor opens in a new tab with your screenshot in a browser frame. Pick a style and background, then export. What it captures The extension captures the visible part of the current tab, at your screen’s full resolution. On a Retina or high-DPI display that means a 2× image with crisp text. It can’t capture the browser’s own pages, such as settings, the new tab page or the extension stores. The button shows a ! if you try. For the full length of a page, use your browser’s full-page screenshot and drop the file into the editor. Permissions and privacy The Chrome and Edge extensions only ask for the activeTab permission. It can see a tab only when you click its button, and only that tab. It doesn’t read your browsing history or run on pages in the background. When you click the button, the screenshot is sent to screenshot.rocks so it can open in the editor tab. It is not stored. The extension’s source code is public. Try it on your own screenshot No extension? Drop or paste a screenshot straight into the editor. Open the editor Using Safari? There isn’t a Safari version. Press ⌘+⇧+4, then Space, and click the Safari window to capture it. Then drop the file into the editor and crop off the browser toolbar, or use the website capture for public pages. Frequently asked questions Q: Is the extension free? A: Yes, and so is the editor. There is no account or watermark. Q: Does it take full-page screenshots? A: No, it captures what’s visible in the tab. Every major browser has a built-in full-page capture; see the full-page screenshot guide. Q: Why does the button show a “!”? A: The page can’t be captured. Browsers don’t let extensions capture their own pages, like settings or the extension store. Try it on a normal website. Q: Does it work in Brave, Vivaldi or Opera? A: Brave and Vivaldi can install extensions from the Chrome Web Store directly, so the Chrome version works. Opera needs its Install Chrome Extensions add-on first. --- ## How to take a full-page screenshot in any browser URL: https://screenshot.rocks/guides/full-page-screenshot/ Updated: 2026-09-24 Every major browser can capture a whole scrolling web page without installing anything. This guide shows where the option is in each one and how to fix the usual problems. Quick reference | | Browser | Where to find it | Shortcut | Chrome | DevTools → Command Menu → Capture full size screenshot | F12, then Ctrl+Shift+P (⌘+⇧+P on Mac) | Firefox | Right-click → Take Screenshot → Save full page | Ctrl+Shift+S (⌘+⇧+S on Mac) | Edge | ⋯ menu → Screenshot → Capture full page | Ctrl+Shift+S (⌘+⇧+S on Mac) | Safari | Web Inspector → right-click → Capture Screenshot | Developer features must be on | iPhone | Take a screenshot → tap the preview → Full Page | Saves as a PDF | Android | Take a screenshot → Capture more or Scroll capture | Name varies by phone Chrome Chrome hides its full-page capture inside the developer tools, but it takes a few seconds once you know where it is. Open the page and press F12 (or ⌘+⌥+I on a Mac) to open DevTools. Press Ctrl+Shift+P (⌘+⇧+P on a Mac) to open the Command Menu. Type screenshot and choose Capture full size screenshot. Chrome saves a PNG to your Downloads folder. The same menu has Capture screenshot for just the visible area, Capture area screenshot to drag out a region, and Capture node screenshot, which captures the element selected in the Elements panel. That last one is handy for a single card or form without cropping afterwards. Firefox Right-click an empty part of the page and choose Take Screenshot, or press Ctrl+Shift+S (⌘+⇧+S on a Mac). Click Save full page at the top right. Choose Download or Copy. Firefox can also capture a single element: hover over the page after starting a screenshot and click a highlighted block. Microsoft Edge Press Ctrl+Shift+S (⌘+⇧+S on a Mac), or open the ⋯ menu and choose Screenshot. Choose Capture full page. Save or copy the result. You can draw on it first if you need to. Edge is built on Chromium, so the Chrome DevTools method above works in Edge too. Safari Safari has no single button for this, but its Web Inspector can capture the whole page as an image. Choose Safari → Settings → Advanced and tick Show features for web developers. (Older versions of Safari call it Show Develop menu in menu bar.) Open the page and press ⌘+⌥+I to open the Web Inspector. In the Elements tab, right-click the line at the top and choose Capture Screenshot. You can right-click any other element in the same way to capture just that part of the page. iPhone and iPad Open the page in Safari and take a screenshot: press the side button and volume up together. On an iPhone with a Home button, press the side button and Home; on an iPad, the top button and a volume button. Tap the preview that appears in the corner. Choose Full Page at the top, then Done and Save PDF to Files. The iPhone saves full-page captures as a PDF, not an image. To get an image, capture the page from a desktop browser in device mode instead; the mobile screenshot guide shows how. Android Most recent Android phones can capture a scrolling screenshot. Take a normal screenshot (usually power and volume down), then tap Capture more in the preview. Samsung calls it Scroll capture. Drag the handles to choose how far down the page to go. When the screenshot looks wrong Images are missing or blank Many sites only load images as you scroll to them. Scroll slowly to the bottom of the page and back to the top, then take the screenshot. A cookie banner or sticky header is in the way Dismiss banners first. For elements that won’t go away, open the Elements panel in DevTools, select the element and press Delete. It disappears until you reload, so you can capture a clean page. The text is blurry The screenshot is only as sharp as your screen. On a standard display, turn on device mode in Chrome DevTools (Ctrl+Shift+M), choose ⋮ → Add device pixel ratio, and set DPR to 2 before capturing. The page is cut off or the capture fails Browsers have a limit on how tall a single image can be, and very long pages can hit it. Capture the page in sections, or capture the part you actually need. Showing a full-page screenshot A full-length page is often ten times taller than it is wide. Shrunk to fit a slide or a post, the text becomes unreadable. It usually works better to crop to the section that matters, then put it in a browser frame. If you want to show the whole length, use the Image frame on a tall 9:16 canvas. If you only need the part of a tab that’s on screen, the browser extension captures it and opens it in the editor in one click. Try it on your own screenshot Drop your full-page screenshot into the editor, crop it, and add a frame and background. Frame your screenshot Frequently asked questions Q: Can I take a full-page screenshot without an extension? A: Yes. Chrome, Firefox, Edge and Safari all have it built in. Firefox and Edge have it in the right-click menu; Chrome and Safari have it in their developer tools. Q: Where does Chrome save full-page screenshots? A: In your Downloads folder, as a PNG named after the page. Q: Why is my iPhone full-page screenshot a PDF? A: Apple only offers the Full Page option as a PDF. Use a desktop browser’s device mode if you need an image. Q: How do I screenshot just one part of a page? A: In Chrome, select the element in the Elements panel and run Capture node screenshot from the Command Menu. Firefox and Safari can capture single elements too. --- ## How to put a screenshot in a browser window URL: https://screenshot.rocks/guides/add-browser-frame-to-screenshot/ Updated: 2026-09-24 A browser frame tells people at a glance that they’re looking at a website. This guide covers adding one, choosing a style that suits the page, and what to put in the address bar. Before: a plain screenshot. After: in a browser window, on a background. Step by step Capture just the page. Leave out your own browser’s tabs and toolbars, because the frame adds its own. On a Mac press ⌘+⇧+4 and drag over the page; on Windows press Win+Shift+S. The extension does this for you in one click. Add it to the editor. Open the editor and drop, choose or paste the screenshot. Wide screenshots go into a browser window automatically. Pick a style. Under Frame, choose Light, Dark, Black, Soft, Square or Plum, or Custom to set every color yourself. Set the address. Type into the Address field, or click the address bar on the frame and type there. Choose the buttons. Toggle Window buttons, Back & forward and Menu button to match how much detail you want. Finish and export. Pick a background, set the canvas size, and export. Try it on your own screenshot Free, no account, and your images stay in your browser. Open the editor Choosing a frame style Match the page’s brightness. A light site looks best in the Light or Soft frame; a dark interface in Dark or Black. A light frame around a dark app draws a hard edge that pulls attention away from the content. Square corners suit dense, technical screenshots; rounded corners suit marketing images. Keep the same style across a set. If a blog post or deck has several screenshots, give them all the same frame, background and size. Save it once with Looks → + and apply it to the rest. What to put in the address bar The real domain for anything public, so people can find it. A short, clean path. acme.com/pricing reads better than a URL full of tracking parameters. Nothing, for unreleased products. Turn the address bar off rather than showing a staging or localhost address. If your screenshot already has a browser toolbar Crop it off first, or you’ll have a browser inside a browser. Click Crop in the editor, choose Freeform, and drag the top edge down past the toolbar. Frequently asked questions Q: Can I type my own URL in the browser frame? A: Yes. Type it in the Address field under Frame, or click the address bar on the frame itself. Q: Can I remove the address bar? A: Yes. Turn off Address bar under Frame. You can also turn off the window buttons, navigation arrows and menu button. Q: Is there a dark browser frame? A: Yes: Dark and Black. Custom lets you pick any colors, including the window buttons. Q: Is it free? A: Yes, with no account or watermark. --- ## How to put a screenshot in an iPhone frame URL: https://screenshot.rocks/guides/put-screenshot-in-iphone-frame/ Updated: 2026-09-24 An iPhone frame makes it obvious a screenshot is from an app or mobile site. Below: the steps, plus a few tricks for a clean status bar. A portrait screenshot in the iPhone frame, on a 1080 × 1440 canvas. Step by step Take the screenshot. On an iPhone press the side button and volume up together; on most Android phones press power and volume down. For a website you can also capture the mobile view from your computer. Move it to your computer with AirDrop, Quick Share, your photo library or email. Add it to the editor. Portrait screenshots go straight into the iPhone frame. If yours doesn’t, click iPhone under Frame. Choose the finish: Space Black, Silver, Gold, Blue or Deep Purple. A dark finish stands out on a light background, and a light one on a dark background. Decide on the Dynamic Island. Leave it on for a current iPhone look, or turn it off if it covers something important at the top of the screen. Size it and export. Use 4:5 for Instagram and LinkedIn posts, 9:16 for stories, or 1:1 for a square. Try it on your own screenshot Free, no account, and your images stay in your browser. Open the editor Get a clean status bar A low battery, a stray notification icon or 3:47 am in the corner is distracting. A few ways to tidy it: iOS Simulator: developers can set a clean status bar with xcrun simctl status_bar booted override --time 9:41 --batteryLevel 100. 9:41 is the time Apple uses in its own product shots. Android: turn on System UI demo mode in Developer options. It shows a full battery, full signal and a fixed time. On any phone: charge it, turn on Do Not Disturb so notification icons don’t appear, and take the screenshot on Wi-Fi. Tall screenshots and scrolling pages The frame’s screen has the shape of a modern iPhone. A screenshot that is taller than that is trimmed to fit. Use Align screenshot to choose whether the top or the middle stays visible. If you want to show a whole long page, a phone frame isn’t the right tool; use the Image frame on a 9:16 canvas instead. The frame is iPhone-shaped, but Android screenshots work too. Most have a similar shape, so only a thin strip is trimmed. Frequently asked questions Q: Can I use an Android screenshot? A: Yes. Android and iPhone screens have similar proportions, so the screenshot fills the frame with little or no trimming. Q: Can I make App Store screenshots with it? A: It’s built for marketing and social images. Apple’s required iPhone screenshot sizes are larger than the editor’s 2300 px maximum, so use a dedicated tool for store listings. Q: Can I put a website in the iPhone frame? A: Yes. Capture the site’s mobile view with the mobile screenshot tool, and it opens in the iPhone frame. Q: Can I change the iPhone’s color? A: Yes. Pick Space Black, Silver, Gold, Blue or Deep Purple under Frame. --- ## How to make beautiful screenshots: 12 practical tips URL: https://screenshot.rocks/guides/beautiful-screenshots/ Updated: 2026-09-24 Most screenshots look rough for the same few reasons: they’re low resolution, show too much, contain messy data, or sit on a loud background. Each of those has a simple fix. One headline, one highlight, a calm background and plenty of space. Before you capture 1. Capture at 2× or higher Blurry text is the most common flaw, and nothing afterwards can fix it. On a Mac with a Retina display, screenshots are already 2×. On a standard display, use Chrome DevTools device mode (Ctrl+Shift+M), choose ⋮ → Add device pixel ratio, set DPR to 2, and capture from the same ⋮ menu. 2. Size the window on purpose A full-screen window on a large monitor produces a wide screenshot with a lot of empty margin. Around 1280 to 1440 pixels wide shows a desktop layout without the dead space. Device mode lets you set an exact width. 3. Use tidy, realistic data “Test test”, lorem ipsum, a dashboard full of zeros and real customer names all look wrong for different reasons. Fill the screen with believable names, round numbers and a sensible amount of content. Setting up a demo account with sample data once saves cleaning up every screenshot after. 4. Clear the clutter Close notifications, dismiss cookie banners and chat widgets, hide the bookmarks bar, and turn off debug toolbars. In a browser you can make any text editable by running document.designMode = 'on' in the console, which is quick for fixing a typo or swapping a name before you capture. 5. Show one thing One open menu, one hover state, one notification. If you need to show three things, that’s three screenshots. Framing 6. Crop to the point Shrinking a whole desktop screen to fit a social post makes everything unreadable. Crop to the part people should look at, even if it’s a single panel. People can read a cropped screenshot; they can only squint at a full one. 7. Frame it to give context A browser window says “website”. A phone says “app”. For a single component, such as a button, a card or a chart, skip the device and just round the corners. 8. Leave space around it A screenshot pressed against the edges of the image looks cramped. Leave roughly 10 to 15 percent of the width as space on each side. Alternatively, let it deliberately run off one edge, as in the image above. Style 9. Pick a calm background The background should make the screenshot stand out, not compete with it. Soft solid colors and gentle two-tone gradients work; busy photos and saturated rainbow gradients don’t. Contrast helps: put dark interfaces on light backgrounds and light interfaces on muted or dark ones. 10. Keep shadows and corners subtle A soft, low shadow lifts the screenshot off the background. A heavy shadow looks dated. Match the corner radius to the product’s own style: sharp for dense tools, rounder for consumer apps. Annotation 11. Annotate sparingly One highlight, or two or three numbered steps, is usually enough. Use a single color that isn’t already in the interface, and save red for errors. A short headline in a good typeface often explains more than any arrow. 12. Be consistent across a set Screenshots in the same post, deck or app listing should share a size, frame, background and position. In Screenshot.Rocks, set it up once and save it with Looks → +, then apply it to each screenshot. Try it on your own screenshot Free, no account, and your images stay in your browser. Open the editor Choosing a file format Export PNG when the screenshot is mostly text and interface, because PNG keeps edges sharp. Use JPEG when a platform has a small upload limit or the image is mostly photos. For your own website, WebP is usually smaller than PNG at similar quality. Whatever the format, export at the size the platform displays; see screenshot sizes. Frequently asked questions Q: What resolution should a screenshot be? A: Capture at 2× pixel density or higher, then export at the size where it will be shown, for example 1600 × 900 for X or 1200 × 630 for a link preview. Q: What’s the best background for a screenshot? A: A soft solid color or a gentle gradient that contrasts with the screenshot: light and muted behind dark interfaces, darker behind light ones. Avoid busy photos. Q: Why do my screenshots look blurry after I post them? A: Either the original was captured at 1×, or the platform resized it. Capture at 2× and upload at the platform’s recommended size so it isn’t scaled again. Q: How do I remove private details from a screenshot? A: Crop them out, cover them with a solid box, or blur them heavily. The redaction guide explains which method to use when. --- ## The right screenshot size for every platform URL: https://screenshot.rocks/guides/screenshot-sizes/ Updated: 2026-09-24 Upload a screenshot at the size a platform displays and it won’t be cropped, letterboxed or scaled twice. These are the sizes to use, checked in September 2026. | | Where | Size (px) | Shape | Notes | X (Twitter) post | 1600 × 900 | 16:9 | Shows uncropped in the timeline. 1200 × 675 works too. Photos can be up to 5 MB. | LinkedIn post, landscape | 1200 × 627 | 1.91:1 | The same shape LinkedIn uses for link previews. | LinkedIn or Instagram post, portrait | 1080 × 1350 | 4:5 | Fills more of a phone feed than a square post. | LinkedIn or Instagram post, square | 1080 × 1080 | 1:1 | Safe everywhere, but smaller in the feed than 4:5. | Stories and Reels | 1080 × 1920 | 9:16 | Keep text away from the top and bottom, where the app draws its own controls. | Link previews (Open Graph) | 1200 × 630 | 1.91:1 | Used when a link is shared in Slack, iMessage, LinkedIn, Facebook and most chat apps. | Product Hunt gallery | 1270 × 760 | about 5:3 | The first image is also the preview card when the launch is shared. Keep each under 3 MB. | Dribbble shot | 1600 × 1200 | 4:3 | Dribbble’s standard shot shape. | Slides (Keynote, Google Slides, PowerPoint) | 1920 × 1080 | 16:9 | A full-bleed image on a widescreen slide. | Blog posts and documentation | 2 × column width | Any | For a 720 px content column, export 1440 px wide so it stays sharp on high-resolution screens. Platforms change their layouts every so often. If an image is cropped unexpectedly, check the platform’s own help pages for the latest size. Why the shape matters more than the size Platforms scale images down to fit, so a 3200 × 1800 image and a 1600 × 900 one look the same on X. What they don’t forgive is the wrong shape. A 4:3 image in a 16:9 slot is cropped or gets bars; a very tall image is cut off in the feed. Get the shape right first, then make sure it’s at least as large as the size in the table. How to export at these sizes In Screenshot.Rocks, the exported image is exactly the size of the canvas. One click: the buttons under Layout set 16:9 (1920 × 1080), 4:3 (1600 × 1200), 1:1 (1200 × 1200), 4:5 (1080 × 1350) and 9:16 (1080 × 1920). An exact size: type the width and height into the W and H fields, for example 1270 × 760 for Product Hunt. Each side can be from 500 to 2300 px. Changing the canvas doesn’t stretch the screenshot. Its frame keeps its proportions, and the background fills the rest. Use Scale to make it larger or smaller within the canvas. For phone screenshots on a 4:5 or 9:16 canvas, put them in an iPhone frame so they fill the space. Try it on your own screenshot Pick a size, drop in a screenshot and export at exactly those dimensions. Open the editor File format and file size PNG keeps text and interface edges sharp. Use it by default for screenshots. JPEG is usually smaller and is the safe choice when a platform has a low upload limit. Text edges get slightly soft. WebP is smaller than PNG at similar quality and suits your own website and docs. One image for everywhere If you can only make one version, 1600 × 900 (16:9) works well on X, in slides and in most feeds. Make a separate 1200 × 630 version for link previews if the page is going to be shared a lot, because 16:9 images are trimmed at the top and bottom in preview cards. Frequently asked questions Q: What is the best size for a screenshot on X (Twitter)? A: 1600 × 900 pixels (16:9). It shows without cropping in the timeline. Q: What size should a LinkedIn screenshot be? A: 1200 × 627 for a landscape post, or 1080 × 1350 (4:5) for a portrait post, which takes up more of the feed on phones. Q: What size are Product Hunt gallery images? A: 1270 × 760 pixels, under 3 MB each. The first image is used as the preview card. Q: What size is an Open Graph (link preview) image? A: 1200 × 630 pixels. Q: Why is my screenshot cropped when I post it? A: Its shape doesn’t match the platform’s. Resize the canvas to the platform’s aspect ratio before exporting instead of relying on the platform to crop it. --- ## How to hide sensitive information in a screenshot URL: https://screenshot.rocks/guides/redact-screenshots/ Updated: 2026-09-24 Before you share a screenshot, check it for anything private and remove it properly. A crop or a solid box can’t be undone. A light blur or small pixelation sometimes can. Blurred regions are pixelated and blurred, then flattened into the exported image. What to check before you share The obvious details are easy to spot. These are the ones people miss: Your name, email and avatar in an account menu or corner of the page. Other people’s data: customer names, emails and amounts in tables, lists and search results. Secrets: API keys, tokens, passwords, recovery codes and one-time codes. The address bar. URLs often contain account IDs, email addresses or access tokens. Browser tabs and bookmarks, which can reveal clients, projects and internal tools. Notifications that arrived while you were capturing. Codes that can be scanned: QR codes, barcodes, boarding passes and tickets. Anything else on screen, like other windows, your desktop and the dock or taskbar. Choose the right method | | Method | Can it be undone? | Use it for | Crop it out | No | Anything near an edge. The safest option. | Solid box | No, once flattened into the image | Passwords, keys, account numbers. | Replace with fake data | No | Marketing and documentation screenshots. | Strong blur or large pixelation | Very unlikely | Names, emails, faces and background details. | Light blur or small pixelation | Sometimes | Nothing sensitive. Pixelation and blur work by averaging nearby pixels. When the effect is light, the average still carries enough of the original shape to be matched. In 2020 a tool called Depix showed this by recovering passwords from pixelated screenshots, by comparing the blocks with pixelated versions of known text. Heavy blur over a generous area leaves too little to match. A crop or a solid box leaves nothing at all. Be careful with apps that keep boxes and shapes as separate layers, such as PDF editors and some markup tools. If the box can be moved or deleted, so can yours. Export a flattened image before you share it. How to blur part of a screenshot Open the editor and drop or paste your screenshot. Click Markup in the toolbar. Choose the Blur tool (or press B) and drag over each area to hide. Drag a blurred box to move it, or use its handles to resize it. Export. The blur is flattened into the image. The blur tool pixelates and blurs the pixels underneath, then draws them over a solid base, so nothing shows through. It has one fixed strength, and there is no filled-box tool yet, so for passwords, keys and account numbers crop them out instead with Crop in the toolbar. Try it on your own screenshot Blur or crop private details before you share. Your screenshot isn’t uploaded. Open the editor Better still: don’t capture it Use a demo account with made-up names and data. It makes every future screenshot safe by default. Edit the page before capturing. Right-click text, choose Inspect, and double-click the text in the Elements panel to change it. Or run document.designMode = 'on' in the console and type straight onto the page. Changes disappear when you reload. Capture only the part you need with a region screenshot (⌘+⇧+4 on a Mac, Win+Shift+S on Windows) rather than the whole screen. Use a clean browser profile for screenshots, with no bookmarks bar and no personal extensions. What about hidden information in the file? Photos taken on a phone can include location and camera details. Screenshots usually carry less, but can still include the device and the time they were taken. Images exported from Screenshot.Rocks are drawn fresh in the browser, so none of the original file’s metadata is copied into them. Frequently asked questions Q: Is blurring safe for passwords? A: Not reliably. Crop passwords, keys and account numbers out, cover them with an opaque box, or change them before capturing. Q: Can pixelated text be read? A: Sometimes. Light pixelation of text can be reversed by comparing it with pixelated samples of known text. Use large blocks or heavy blur over a generous area, or remove the text entirely. Q: Does exporting from Screenshot.Rocks remove metadata? A: Yes. The exported image is drawn fresh in the browser, so metadata from the original file is not included. Q: Are my screenshots uploaded when I blur them? A: No. Editing happens in your browser. The screenshot isn’t sent anywhere unless you share the exported file yourself. --- ## Privacy policy URL: https://screenshot.rocks/privacy.html Updated: 2026-09-24 Short version: images you edit stay in your browser and are never stored by us. We use analytics to see how the site is used. We don’t sell your data. Last updated 24 September 2026 Your images Screenshots you drop, choose or paste into the editor are processed entirely in your browser. They are not uploaded to our servers, and exported images are created on your device. Two optional features send data to our servers so they can work. Neither stores it: Website capture. When you enter a web address and press Capture, the address is sent to our screenshot service, which loads that page and returns an image of it to your browser. Browser extension. When you click the extension’s button, the screenshot of your current tab is sent to screenshot.rocks so it can be opened in the editor. It is passed straight back to your browser and not kept. The extension only has access to a tab when you click its button. Settings stored in your browser The editor remembers your preferences, such as your last frame, background and export format, and any looks you save, in your browser’s local storage. This stays on your device and isn’t sent to us. Clearing this site’s data in your browser removes it. Analytics We use Google Analytics and Fathom Analytics to understand how many people use the site and which pages they visit. Google Analytics may set cookies, and our Google tag also measures conversions from Google Ads. Fathom doesn’t use cookies. We use this information in aggregate to improve the site; we don’t use it to identify you. Other services we use | | Service | What it’s for | What it receives | Our hosting provider | Serving the website | Standard request logs: IP address, browser type, pages requested, date and time | Google Analytics and Google Ads | Usage statistics and ad conversion measurement | Pages visited, device and browser details, cookies | Fathom Analytics | Cookie-free usage statistics | Pages visited and referrer, without cookies | Bunny Fonts | Fonts for text in the editor | Your IP address when a font is loaded, which only happens when you open the font menu or use one of its fonts What we don’t do We don’t require an account, so we don’t hold your name, email address or password. We don’t sell or rent personal data. We don’t store the images you edit, capture or send from the extension. Your rights If you’re in the UK or European Economic Area, you have rights under the GDPR: Access: ask for a copy of personal data we hold about you. Rectification: ask us to correct data that’s inaccurate or incomplete. Erasure: ask us to delete your personal data, in certain circumstances. Restriction: ask us to limit how we use your data, in certain circumstances. Objection: object to how we process your data, in certain circumstances. Portability: ask us to transfer your data to you or another organization, in certain circumstances. We’ll respond within one month. Because we don’t have accounts, we usually hold very little that can be linked to you, but we’ll tell you what we find. Contact For questions about this policy or to make a request, email dave+screenshot.rocks@earley.email. Changes If this policy changes, we’ll update it here and change the date at the top.