Screenshot Annotator
Add annotations to screenshots without modifying the original image. Annotations are overlaid on top.
Workflow
- Analyze the screenshot to identify the target element
- Generate annotation overlay using Gemini Vision API
- Output annotated image as a separate file
Usage
python scripts/annotate.py "{image_path}" "{instruction}" --style "{style}" --text "{label}" --output "{output_path}"
Parameters
| Parameter | Required | Default | Description |
|---|---|---|---|
| image_path | Yes | - | Path to screenshot |
| instruction | Yes | - | What to annotate (e.g., "the Login button") |
| --style | No | red_box | Annotation style |
| --text | No | - | Text label to add |
| --output | No | auto | Output path |
Styles
| Style | Description |
|---|---|
| red_box | Red rectangle + arrow (default) |
| arrow | Red arrow pointing to element |
| callout | Speech bubble with text |
| highlight | Semi-transparent yellow overlay |
| circle | Red circle around element |
| number | Numbered marker for steps |
Examples
# Basic annotation
python scripts/annotate.py "login.png" "the Login button"
# With text label
python scripts/annotate.py "settings.png" "the gear icon" --text "Click here"
# Callout style
python scripts/annotate.py "form.png" "email field" --style callout --text "Enter your email"
Requirements
- GEMINI_API_KEY or GOOGLE_API_KEY in environment
- Python packages: google-genai, Pillow, python-dotenv