capture-webpage
CommunityCapture live webpages as Figma designs.
Authorryanallen
Version1.0.0
Installs0
System Documentation
What problem does it solve?
Captures a live webpage as a Figma design by automating a Playwright-based workflow and submitting the result to the configured design MCP.
Core Features & Use Cases
- Automates capturing of live webpages into Figma designs using Playwright and the Figma MCP.
- Supports both external sites and locally hosted pages, bypassing CSP where needed and providing deterministic viewport options.
- Use cases include design reviews, design-system updates, and rapid creation of design references from live pages.
Quick Start
Provide the webpage URL and the Figma file URL, then trigger the capture-webpage skill to create a Figma design from the page.
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: capture-webpage Download link: https://github.com/ryanallen/Studio/archive/main.zip#capture-webpage Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
Agent Skills Search Helper
Install a tiny helper to your Agent, search and equip skill from 223,000+ vetted skills library on demand.