MarkShot - Screenshot Editor, Screen Recorder & Step Guide

MarkShot is an all-in-one Chrome screenshot, annotation, screen recording, step guide, and bug report extension. It helps you capture anything on your screen, explain it clearly with visual tools, protect private details, and export the final result as an image, PDF, guide, or bug report. MarkShot is built for product teams, QA testers, developers, designers, support teams, teachers, students, and anyone who needs to explain something visually. CAPTURE OPTIONS New Empty Page Start with a clean blank canvas when you do not want to capture an existing webpage. This is useful for creating quick visual notes, mockups, diagrams, labels, or instruction boards. Capture Visible Area Capture the currently visible part of the active tab. Use this for quick screenshots of what is on screen right now. Capture Selected Area Drag to select a specific region of the page. This is useful when you only need one section, form, card, button, table, error message, or UI component. Capture Full Page Capture the entire webpage, including the content below the fold. This is useful for landing pages, documentation, long dashboards, reports, articles, and full-page reviews. Auto Scroll Capture Capture content while scrolling automatically. This helps when the important area is longer than the current viewport. Select & Scroll Select a region and capture while scrolling through it. This is useful for scrollable containers, panels, tables, chat windows, sidebars, and embedded content. Capture Window / Screen Capture a browser window, application window, or full screen. This is useful for desktop workflows, browser comparisons, app demos, and cross-application bug reports. Start Screen Recording Record your screen for demos, tutorials, walkthroughs, QA reports, or issue reproduction. Start Tab Recording Record the current browser tab. This is useful for focused demos and browser-only walkthroughs. Create Step Guide Record user actions as step-by-step instructions. MarkShot can help turn clicks and screenshots into a guide that is easier to follow. Bug Report Mode Capture a screenshot and collect supporting details for a clear bug report. EDITOR TOOLS Draw > Pen The default editor tool. Use Pen to draw freehand marks, circles, underlines, check marks, and quick annotations. Draw > Marker Use Marker for stronger freehand emphasis. It is helpful when you want a thicker, more visible drawing style. Draw > Highlighter Use Highlighter to visually highlight important areas without fully covering the content beneath. Arrow Tool Add arrows to point at important interface elements, bugs, buttons, text, or visual details. Arrow Types Straight Arrow: A simple direct arrow for pointing to one item. Curved Arrow: A softer arrow for guiding attention around other content. Bent Arrow: A right-angle style arrow for structured UI callouts. Double Arrow: Points in both directions, useful for comparisons or spacing. Dashed Arrow: Indicates a suggested direction, optional step, or conceptual movement. Dotted Arrow: Useful for subtle guidance or secondary relationships. Numbered Arrow: Combines an arrow with a number for ordered instructions. Text Arrow: Adds text to an arrow so you can explain what it points to. Free Draw Arrow: Draw an arrow freely for organic annotations. Shapes Use shapes to frame, highlight, separate, or explain content. Rectangle Draw a rectangular outline around buttons, fields, images, sections, or errors. Rounded Rectangle Use a softer rectangle style for modern UI annotations. Circle Circle a small object, icon, status, badge, avatar, or control. Ellipse Highlight wider or oval-shaped content. Diamond Use for decisions, warnings, or flow-style diagrams. Triangle Use for alerts, directional emphasis, or visual callouts. Line Draw a simple line to underline, divide, connect, or indicate alignment. Speech Bubble Add a speech-style bubble to explain something in a conversational way. Callout Box Add a callout-style box with a pointer for comments and notes. Text Tools Plain Text Add simple text directly on the screenshot. Text Box Add text inside a box for more readable explanations. Callout Text Add editable callout text. It behaves like a text box and can be edited inline. The callout keeps its original design while editing, and it can expand in width and height as the text grows. Number Badge Add a numbered badge for steps, ordered instructions, or visual references. Label Tag Add a tag-style label for categories, statuses, names, or quick identifiers. Highlight Text Add text with a highlight background for emphasis. Sticky Note Add a sticky-note style annotation for comments, reminders, review notes, or feedback. Code Text Add code-style text using a monospace style. Useful for variables, commands, errors, snippets, keys, and technical notes. Watermark Add watermark-style text to brand, identify, or label an image. Eraser Remove annotations from the canvas. The eraser can be used to clean up drawings or remove unwanted objects. Crop Crop the screenshot to the important area. Use this to remove unnecessary browser content, whitespace, or unrelated page sections. Zoom Area Create a zoomed-in area so small details are easier to inspect. Blur Blur sensitive or private information such as emails, names, tokens, addresses, customer data, or internal details. Pixelate Pixelate private information while keeping the general layout visible. Redact Cover sensitive content completely with a solid block. Number Badge Tool Number badges are available under Text > Number Badge, keeping step markers organized inside the Text menu. EDITOR PROPERTIES Stroke Color Change the outline or drawing color. Useful for matching brand colors or using red, blue, green, or other emphasis colors. Fill Color Change the background fill for shapes, text boxes, callouts, labels, highlights, and badges. No Fill Disable fill for shape-style annotations when you only want an outline. Stroke Width C…