Guides

Practical guides for real screenshot workflows.

Browser frames, screenshot redaction, social-ready sizing, and the workflows behind launches, bug reports, changelogs, and docs — each guide opens a focused walkthrough.

Developer workflows

Bug reports, annotations, and credential safety

Developer workflow7 min read

How to take better bug report screenshots

What to include in the frame, how to annotate the problem clearly, what to redact before attaching, and why PNG beats JPEG for bug reports.

Best for developers, QA engineers, and support teams.
Tab recording7 min read

How to record a browser tab in Chrome

Record the current tab, watch the REC badge, stop and edit from the extension, trim, frame, and export a local WebM.

Best for product demos, bug clips, support walkthroughs, and changelog videos.
Full-page capture6 min read

How to take a full page screenshot in Chrome

Capture the entire scrolling page two ways: the built-in DevTools command or one click in the extension, then frame, annotate, redact, and export.

Best for bug reports, documentation, design review, and archiving.
Annotation5 min read

How to annotate screenshots in Chrome — arrows, highlights, and when to use each

Which annotation tool fits each situation, how to keep annotations clear, and the most common mistakes that make annotations work against you.

Best for developers, QA engineers, technical writers, and support teams.
Security6 min read

How to redact API keys and passwords in screenshots

Why blur is not safe for credentials, which redaction method to use instead, and how to catch hidden tokens in the address bar and browser tabs before sharing.

Best for developers, QA engineers, and security-conscious teams.
Workflow9 min read

How to create consistent screenshots for docs and tutorials

A repeatable workflow covering capture, crop, redaction, annotation style, and export — so every screenshot in a guide looks like it belongs to the same system.

Best for technical writers, support teams, and product teams.
Windows5 min read

Snipping Tool alternative for Chrome — capture, edit, and export in one tab

A Chrome-native replacement for the Snipping Tool round-trip: capture, annotate, redact, and export without leaving the browser or switching apps.

Developers, support teams, technical writers
Privacy & redaction

Clean screenshots before they leave the browser

Privacy8 min read

How to redact sensitive information in screenshots — the secure way

The main walkthrough for screenshot redaction: what to hide, blur vs pixelate vs solid fill, and a local FramedShot workflow before anything gets shared.

Best for technical writers, support teams, and QA engineers.
Privacy6 min read

Blur vs pixelate vs solid fill: which screenshot redaction method to use

How to choose between the three redaction methods based on risk level — and when blur is not safe enough for credentials and secrets.

Best for developers, support teams, technical writers, and QA engineers.
Privacy4 min read

How to redact a screenshot on Windows without uploading it

Why Snipping Tool and Paint are not enough for proper redaction, and how to blur, pixelate, or block sensitive info locally before a screenshot leaves your machine.

Best for QA, support, and product teams on Windows.
Privacy7 min read

How to redact in Snipping Tool without leaving data exposed

Why the highlighter is not redaction, how to fully cover sensitive data in the Windows Snipping Tool, and a cleaner option that flattens on export.

Best for Windows users hiding sensitive screenshots.
Product & social

Changelogs, launches, and social-ready exports

Product workflow5 min read

How to prepare changelog screenshots that look polished every release

A repeatable workflow for framing, styling, and exporting release screenshots — including how to use presets so every update matches the last.

Best for developers, indie makers, and product teams publishing regular updates.
Presets5 min read

Best screenshot sizes for X, LinkedIn, Instagram, and more

A simple reference for the dimensions people actually need when one screenshot has to work across several channels.

Best for launches, product updates, changelogs, content marketing, and social promotion.
Comparison5 min read

The best free Xnapper alternative for aesthetic screenshots

Get the same gradient backgrounds, browser frames, and saved themes as Xnapper — entirely in your browser, for free, with no watermarks.

Best for social media managers, indie hackers, and content creators.
Alternative5 min read

The free Xnapper alternative for Windows

Xnapper is Mac-only. FramedShot is the free Chrome alternative for Windows — browser frames, redaction, no upload, no watermark.

Best for Windows users looking for a Xnapper-style screenshot workflow.
Launch Visuals6 min read

Product Hunt gallery screenshot sizes, specs, and design guide (2026)

The exact 1270 × 760 px specs, why raw screenshots hurt launches, and a 30-second workflow to go from capture to polished gallery image without Figma.

Best for SaaS founders and indie builders preparing a Product Hunt launch.
Mockups & presentation

Browser frames, portfolios, and collage layouts

Guide6 min read

How to add a browser frame to a screenshot

Workflow for browser frames for SaaS screenshots (dashboards, admin, analytics) and general product UI — frame, padding, export. Install path: browser mockup generator.

Best for SaaS product shots, portfolios, changelogs, launch decks, and Build in Public posts.
Windows4 min read

Add a browser frame to a screenshot on Windows

Post-capture workflow: Snipping Tool or FramedShot grab → frame and pad in Chrome → export for Teams, Jira, or docs. Complements the generic browser-frame guide with PC-specific habits.

Best for Windows teams shipping bug reports, help docs, and release visuals.
Portfolio4 min read

How to create professional website mockups for your portfolio

Add browser frames, gradients, and retina-quality exports to your screenshots so your portfolio looks finished, not flat.

Best for designers, developers, and indie hackers.
Collage5 min read

How to create professional screenshot collages (step-by-step)

Learn how to put two screenshots together in Chrome, build side-by-side comparisons, and export clean 2x2 grid visuals fast.

Best for before/after updates, release recaps, QA reports, and social posts.
FeatureComparison layouts

Compare screenshots side by side without canvas setup

Build before/after visuals with structured side-by-side and grid layouts for launches, QA, and changelogs.

Best for visual diffs, recap posts, and multi-image product storytelling.
Image Framing5 min read

How to frame images in Chrome — background, padding, and browser frame

Upload any image you already have and wrap it in a background, padding, and optional browser chrome — no design tool, no account, no upload to external servers.

Best for product builders, marketers, and technical writers.

Need the product behind the guides?

FramedShot is a Chrome extension for browser frames, screenshot annotation, privacy-safe edits, and social-ready exports — no upload, no account, no watermark.

Install FramedShot

Related

Deeper workflows, feature pages, and outcome-focused walkthroughs.

All features Comparisons hub Use cases Browser mockup generator Tab video recorder Local-first privacy Launch post screenshots Changelog visuals Screenshot collage maker