Skip to content

How to Create Portfolio Screenshots with Claude

Create portfolio screenshots with Claude and ToolRouter. Showcase web design work professionally.

Tool
Web Screenshot icon
Web Screenshot

Claude turns portfolio screenshot capture into an interactive creative process in your terminal. Describe the project and Claude suggests which pages to capture, asks about viewport preferences, and captures responsive variants. Follow up with "can you also grab the dark mode version?" or "capture just the hero section for the case study header" for tailored portfolio assets.

Connect ToolRouter to Claude

1Open connector settings Open Settings
2Add a custom connector with these details
Name
ToolRouter
URL
https://api.toolrouter.com/mcp
3Let Claude set you up Open Claude

Steps

Once connected (see setup above), use the Web Screenshot tool:

  1. Ask Claude: "Capture screenshots of example.com at desktop, tablet, and mobile sizes for my portfolio"
  2. Claude uses capture_responsive to produce screenshots at each viewport size
  3. Ask Claude to capture the full page and specific sections for different portfolio views
  4. Request additional pages captured for a comprehensive case study

Example Prompt

Try this with Claude using the Web Screenshot tool
Capture our client site at desktop (1440px), tablet (768px), and mobile (375px) viewports for the portfolio case study.

Tips

  • Ask Claude to capture the most visually impressive sections of each page
  • Request both full-page and above-the-fold screenshots for different portfolio formats
  • Claude can capture multiple client sites in one session for batch portfolio updates