Capturing Bugs

Annotation & Markup

Crosscheck includes a powerful annotation editor. After capturing a screenshot, you can mark up the image with drawings, text, arrows, shapes, and blur effects before saving or sharing it.

When is annotation available?

The annotation toolbar appears automatically after you take a screenshot. You can also annotate live during a screen recording — open the pen icon on the floating recording toolbar to draw directly on the page as you capture. The same pen, shapes, arrow, line, text, and undo / redo controls are available, with a size selector for stroke width.

Annotation Tools

The toolbar provides the following tools. Each tool can be combined with the color picker and adjusted for stroke width.

Tool	Description	Usage
Color Picker	Choose the color used by every annotation you draw next	Click the color swatch in the toolbar and pick a color before drawing
Pen	Draw freehand on the screenshot	Select the pen and drag across the canvas to sketch
Rectangle	Draw a rectangle to box off an area	Click and drag to define the rectangle area
Ellipse	Draw a circle or ellipse to highlight a region	Click and drag to define the ellipse size and position
Arrow	Point at a specific element to draw attention to it	Click and drag from the start point to the arrow head
Line	Draw a straight line for callouts or measurements	Click and drag from the start point to the end point
Focus / Spotlight	Dim everything except the area you want the viewer to see	Select the focus tool and drag over the region to spotlight
Blur	Pixelate sensitive information like emails, names, or tokens before sharing	Select the blur tool and drag over the area you want to hide
Hand / Move	Pan around the screenshot without drawing	Select the hand tool and drag to reposition the canvas view
Undo / Redo	Step backward or forward through your annotation history	Click the undo or redo button in the toolbar

Tool Overview

Color Picker

Choose the color used by every annotation you draw next.

Pen

Draw freehand to highlight areas, circle bugs, or sketch quick notes.

Rectangle

Draw a rectangle to box off an area of the screenshot.

Ellipse

Draw a circle or ellipse to highlight a region.

Arrow

Point at a specific UI element to draw attention to it.

Line

Draw a straight line for callouts or measurements.

Focus / Spotlight

Dim everything except the area you want the viewer to see.

Blur

Pixelate sensitive information like emails, names, or tokens before sharing.

Hand / Move

Pan around the screenshot without drawing on it.

Undo / Redo

Step back or forward through your annotation history.

How to Annotate a Screenshot

Capture a screenshot

Click the screenshot button in the Crosscheck extension popup or use the keyboard shortcut. The annotation editor opens automatically once the screenshot is captured.

Select a tool

Choose a tool from the annotation toolbar at the top of the editor. The active tool is highlighted.

Pick a color

Click the color picker to choose a stroke color for your drawings, arrows, or shapes. The selected color applies to all subsequent annotations until you change it.

Draw on the canvas

Click and drag on the screenshot to add your annotation. Text boxes can be placed with a single click.

Undo mistakes

Use the undo and redo buttons in the toolbar, or press Ctrl+Z / Cmd+Z to step back through your changes.

Save and share

Once you are satisfied with your annotations, click Save. The annotated screenshot replaces the original screenshot and is ready to share.

Annotation toolbar with drawing tools, color picker, and undo/redo buttons — The annotation toolbar appears after capturing a screenshot

Blurring Sensitive Information

The blur/pixelate tool lets you obscure any part of the screenshot before sharing. This is useful for hiding passwords, API keys, personal information, or any confidential data visible in the check.

Select the blur tool

Click the blur/pixelate icon in the annotation toolbar.

Drag over the area

Click and drag to draw a rectangle over the content you want to redact. The area inside the rectangle will be pixelated.

Adjust if needed

You can resize or reposition the blur region by selecting it. Add multiple blur regions as needed.

Blur tool applied to sensitive data on a screenshot — Sensitive data redacted using the blur tool

Annotating During a Live Recording

You can also annotate while a screen recording is in progress. Anything you draw appears on top of the page in real time and is captured as part of the recording, so reviewers see the annotations play back exactly when you made them.

Start a screen recording

From the Crosscheck extension popup, pick Current Tab or Full Screen under the Screen Recording heading and start recording. The floating recording toolbar appears with a live timer.

Use the live annotator

As soon as recording starts, the live annotator is already available on the floating toolbar — no need to open anything. Click the pen icon to start drawing on the page without interrupting the recording.

Pick a tool and draw on the page

Use any of the drawing tools to highlight what is happening on screen:

Pen — Draw freehand directly on the page.
Rectangle and Ellipse — Frame areas of interest while you talk through them.
Arrow and Line — Point at specific UI elements as you reproduce the bug.
Text — Drop quick callouts on screen without pausing the recording.

Adjust color and stroke size

Use the color control to change the drawing color, and the size selector (S / M / L) — with a slider for fine control — to set the stroke width before your next stroke.

Undo or clear mistakes

Use Undo and Redo to step backward or forward through your live drawings, or click the close (×) button to exit the annotator and return to a clean recording surface.

Stop the recording

When you are done, click Stop on the floating toolbar. Your annotations are baked into the final video — reviewers do not need to enable anything extra to see them.

Live annotator toolbar during a screen recording with a freehand drawing on the page — The live annotator on the floating recording toolbar — pen, shapes, arrow, line, text, undo / redo, and S / M / L size selector — drawn directly on the page while recording.

Use it for narrated walkthroughs

Combine the live annotator with the microphone toggle to circle elements, draw arrows, and explain what is wrong as you reproduce the bug.

Instant Replay

Developer Context (DevTools)

Last updated: March 2026