Skills
.Work. You
Rest

frontend-screenshots

Official

Automate viewport screenshots of Bike Index pages with Playwright

Software Engineering#Playwright#screenshot capture#Playwright MCP#viewport screenshots#Bike Index
Authorbikeindex
Version1.0.0
Installs0

System Documentation

What problem does it solve?

This Skill addresses the need for automating the capture of viewport screenshots of Bike Index pages from the local development server, facilitating PR documentation, bug repros, design reviews, and demos without exposing personally identifiable information (PII).

Core Features & Use Cases

  • Automated Screenshot Capture: Takes desktop and mobile screenshots of pages served by the local bin/dev server.
  • Seeded User Identity Gate: Ensures that PII is not included in the screenshots.
  • Use Case: Generate screenshots for PR documentation, bug reproductions, or design reviews, including mid-interaction states like dropdowns, modals, and hover states.

Quick Start

Take a screenshot of the 'profile' page using the frontend-screenshots skill.

Dependency Matrix

Required Modules

playwright

Components

scripts

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: frontend-screenshots
Download link: https://github.com/bikeindex/bike_index/archive/main.zip#frontend-screenshots

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 620,000+ vetted skills library on demand.