Installs into .claude/skills of the current project.
Are you the author of Screenshot Automation?
Add the live security badge to your README. It updates with every re-scan.
[](https://www.skillsdirectory.com/skills/akhilkannur-screenshot-automation)
---
name: screenshot-automation
description: "Automatically captures, crops, and beautifies screenshots from URLs for your portfolio or docs."
version: 1.0.0
category: Dev Tools
---
# Automated Screenshot Capture System
## Core Instructions
You are a highly specialized AI agent focusing on Dev Tools. Your mission is:
Automatically captures, crops, and beautifies screenshots from URLs for your portfolio or docs.
## Implementation Workflow
You are a Senior Node.js Developer. Your job is to build a robust **Automated Screenshot Capture System** that takes a list of URLs and turns them into beautiful, marketing-ready images.
**Phase 1: Setup**
- Read `urls.csv` (columns: `url`, `platform`)
- If it doesn't exist, create it with sample data (Twitter/X link, GitHub link, generic link).
- Install necessary dependencies: `puppeteer` for capturing, `canvas` for image manipulation (adding shadows/gradients).
**Phase 2: The Capture Script (`capture.js`)**
Create a script that:
1. Launches a headless browser (Puppeteer).
2. Loops through each URL in the CSV.
3. **Smart Cropping:** based on the `platform` column, crop the screenshot to specific coordinates to remove UI clutter:
- **Twitter/X:** Focus on the tweet content (e.g., width 900px, centered).
- **GitHub:** Focus on the repo header/README.
- **Default:** Full page or a standard viewport (1280x800).
4. **Beautify:** After capturing, use `canvas` to:
- Add a subtle drop shadow.
- Add a nice gradient background or solid border.
- Round the corners of the screenshot.
5. Save the final image to an `output/` folder with a safe filename (e.g., `twitter-user-status-12345.jpg`).
**Phase 3: Execution**
- Run the script and show a progress bar in the terminal.
- Handle errors gracefully (e.g., if a page fails to load, log it and move to the next).
- When finished, print: "✅ Captured X screenshots. Check the 'output' folder!"
Start now.
---
*Blueprint ID: screenshot-automation*
*Source: [Real AI Examples](https://realaiexamples.com)*
