renatoasse/opensquad

image-fetcher

Acquires visual assets from multiple sources: web image search, live website screenshots via Playwright, and user-provided files. Organizes assets in the squad's reference folder.

First seen Mar 15, 2026

Installation

$ npx skills add renatoasse/opensquad --skill image-fetcher

Similar popular skills

Related neighbors and high-traction skills in the same topics — useful to compare before installing.

Also in this package

Other skills from renatoasse/opensquad · top by installs.

npx skills add renatoasse/opensquad

Browse all from renatoasse/opensquad

More details

Agent compatibility

Declared targets from SKILL.md / docs. Unmarked agents are not listed — the skill may still install via the CLI.

Claude Code Not declared
Cursor Not declared
Codex Not declared
GitHub Copilot Not declared
Windsurf Not declared
Gemini CLI Not declared
Cline Not declared
OpenCode Not declared

Repository health

Stars 2.1K
Default branch master
Open issues 6
Status Active

Skill metadata

Parsed from SKILL.md frontmatter.

Version1.0.0

Package contents

Files included with this skill beyond the listing page.

  • skill md SKILL.md 3,574 B
  • docs SUMMARY.md 200 B

History

  1. First seen on skills.sh
  2. First recorded snapshot · 21 installs

SKILL.md

Asset Fetcher

When to use

Use the Asset Fetcher when you need to acquire visual assets for content creation. It supports three acquisition modes: web image search, live website screenshots via Playwright, and organizing user-provided files. All assets are saved to the squad's reference or output folder with descriptive filenames and metadata.

Instructions

Capabilities

  1. Web Image Search -- Use the native web_search tool to find images by keyword. Evaluate results and download the best match.
  1. Live Screenshot -- Use Playwright MCP to navigate to a URL, set viewport dimensions, and capture a screenshot.
  1. Asset Organization -- Save all acquired assets with descriptive filenames in the squad's reference/ or output/ folder.

Screenshot Modes

  • viewport -- Capture only the visible viewport area (default)
  • full_page -- Capture the entire scrollable page
  • selector -- Capture a specific CSS selector element

Screenshot Workflow

When taking a screenshot:

  1. Navigate to the URL with browser_navigate
  2. Set viewport: browser_resize with width/height for target format

- Instagram post: 1080x1080 - Instagram carousel: 1080x1440 - Story/Reel: 1080x1920 - Generic: 1280x720

  1. Wait for page load (browserwaitfor if needed)
  2. Capture: browsertakescreenshot
  3. Save to reference folder with descriptive filename

Asset Metadata

After acquiring each asset, document in your output:

  • path: local file path
  • width/height: image dimensions
  • sourcetype: "websearch" | "screenshot" | "user_provided"
  • original_url: source URL (if applicable)

Cache Policy

Before fetching an asset:

  • Check if the reference folder already has a matching file
  • Use deterministic filenames based on source (e.g., URL slug + viewport)
  • Reuse existing assets to avoid redundant fetches

Safety

  • Timeout: max 30s per screenshot, skip and warn if exceeded
  • Maximum screenshot dimensions: 1920x1920px
  • Block file:// protocol URLs
  • Block localhost and private IP ranges (127.0.0.1, 10.x, 192.168.x)

Best Practices

  • Prefer screenshots over web search for product/tool pages (images are often outdated)
  • Save with descriptive names: gemini-benchmark-chart.png not image1.png
  • Normalize URLs before caching (strip tracking params)
  • Document all acquired assets with metadata for downstream tools

Available operations

  • Web Image Search -- Find and download images by keyword from the web
  • Live Screenshot -- Capture viewport, full-page, or element screenshots of any URL
  • Asset Organization -- Save and catalog assets with descriptive filenames and metadata
  • Cache Check -- Detect and reuse previously fetched assets to avoid redundant downloads