Takes focused screenshots of specific page regions instead of dumping entire viewports. You give it a topic or URL, it researches the best source page, navigates Chrome via remote debugging, locates the target element with DOM selectors, and crops to just that region. The workflow separates research from capture: it uses text-based tools to evaluate candidate pages before touching the browser, which saves time since most pages aren't worth screenshotting. Useful when you need a clean illustration of a tweet, Reddit post, product hero section, or docs snippet without the noise of navigation bars and sidebars. Enforces a hard rule: no uncropped screenshots as final output.

skills.sh installs
4.1K
last updated
Aug 21, 2026

Install

$ npx -y skills add zc277584121/marketing-skills --skill browser-screenshot --agent claude-code

Installs into .claude/skills of the current project.

Files

Skill: Browser Screenshot

Take focused screenshots of specific regions on web pages — a Reddit post, a tweet, an article section, a chart, etc. — not just a full-page dump.

Prerequisite: agent-browser must be installed. This skill uses its own headed Chrome with a dedicated persistent profile; the user's daily Chrome does not need remote debugging.

Dedicated Browser Profile

Use the same dedicated persistent profile convention as my-chrome-automation:

PROFILE_DIR="${AGENT_BROWSER_PROFILE:-$HOME/.agent-browser-chrome}"
NAMESPACE="${NAMESPACE:-browser-screenshot}"
SESSION="${SESSION:-focused-capture}"

ab() {
  agent-browser --namespace "$NAMESPACE" --session "$SESSION" --headed --profile "$PROFILE_DIR" "$@"
}

Run every browser command through ab. Do not use --auto-connect, generic CDP discovery, or the user's daily Chrome profile. The dedicated profile preserves cookies and login state across tasks while allowing the user's normal Chrome to remain open and untouched.

Choose a descriptive SESSION for the task when practical. Do not run multiple tasks against the same profile concurrently; reuse it sequentially to avoid profile-lock conflicts.

Sponsors

Details

Repository
github.com/zc277584121/marketing-skills
Categories
Frontend Development, Automation & Workflows, Marketing & SEO
First seen
May 16, 2026

More from zc277584121/marketing-skills

All 14
1inngest avatarinngest-durable-functionsinngest/inngest-skillsUse when building functions that must survive process crashes, retry automatically on failure, run on a schedule, react to events, or maintain state across infr4Kskills.sh installs
2dotnet avatarmaui-app-lifecycledotnet/skills.NET MAUI app lifecycle guidance — the four app states, cross-platform Window lifecycle events (Created, Activated, Deactivated, Stopped, Resumed, Destroying), 4Kskills.sh installs
3sanity-io avatarcontent-experimentation-best-practicessanity-io/agent-toolkitContent experimentation and A/B testing guidance covering experiment design, hypotheses, metrics, sample size, statistical foundations, CMS-managed variants, an4Kskills.sh installs
4softaworks avatarplugin-forgesoftaworks/agent-toolkitCreate and manage Claude Code plugins with proper structure, manifests, and marketplace integration. Use when creating plugins for a marketplace, adding plugin 4Kskills.sh installs
5figma avatarfigma-implement-designfigma/mcp-server-guideTranslates Figma designs into production-ready application code with 1:1 visual fidelity. Use when implementing UI code from Figma files, when user mentions "im4Kskills.sh installs
6forcedotcom avatargenerating-flexipageforcedotcom/sf-skillsUse this skill when users need to create, generate, modify, or validate Salesforce Lightning pages (FlexiPages). Trigger when users mention RecordPage, AppPage,4Kskills.sh installs