Habilidades screenshots
📸

screenshots

Baixo Risco ⚙️ Comandos externos🌐 Acesso à rede📁 Acesso ao sistema de arquivos

Generate Marketing Screenshots with Playwright

Creating marketing-quality screenshots for Product Hunt, social media, or documentation is time-consuming. This skill automates screenshot capture with retina resolution using Playwright.

Suporta: Claude Codex Code(CC)
📊 71 Adequado
1

Baixar o ZIP da skill

2

Upload no Claude

Vá em Configurações → Capacidades → Skills → Upload skill

3

Ative e comece a usar

Testar

A utilizar "screenshots". Generate 5 marketing screenshots of my Next.js app at localhost:3000

Resultado esperado:

Created screenshots directory and captured 5 retina-quality images: 01-landing-hero.png, 02-features-grid.png, 03-dashboard-view.png, 04-analytics-panel.png, 05-settings-modal.png. All files are 2880x1800 resolution ready for marketing use.

A utilizar "screenshots". Screenshot the pricing page after clicking the annual toggle

Resultado esperado:

Navigated to /pricing, clicked annual billing toggle, waited for price update animation, captured pricing-annual.png showing updated pricing display.

Auditoria de Segurança

Baixo Risco
v1 • 2/25/2026

Static analysis detected 83 pattern matches, but all are false positives. The SKILL.md file contains documentation and code examples for a legitimate Playwright screenshot tool. External commands are standard development tooling (npx, npm, node, mkdir). Network references are localhost examples in documentation. Filesystem operations create a screenshots directory for user output.

1
Arquivos analisados
402
Linhas analisadas
6
achados
1
Total de auditorias
Problemas de Baixo Risco (3)
External Command Execution
Skill executes shell commands for Playwright operations and file management. Commands are standard development tooling with hardcoded arguments.
User Credential Collection
Skill prompts users for login credentials (email, password) to access authenticated pages for screenshots. Credentials are used in generated scripts.
Localhost Network Access
Skill accesses localhost URLs provided by users for screenshot capture. This is expected behavior for a web app screenshot tool.

Fatores de risco

⚙️ Comandos externos (5)
🌐 Acesso à rede (1)
📁 Acesso ao sistema de arquivos (1)
Auditado por: claude

Pontuação de qualidade

38
Arquitetura
100
Manutenibilidade
87
Conteúdo
50
Comunidade
84
Segurança
91
Conformidade com especificações

O Que Você Pode Construir

Product Hunt Launch

Generate a set of 5-10 hero screenshots showcasing key features for your Product Hunt launch page.

Documentation Screenshots

Create consistent UI reference screenshots for user guides and tutorial documentation.

Social Media Content

Produce eye-catching feature demo screenshots optimized for Twitter, LinkedIn, and other social platforms.

Tente Estes Prompts

Basic Screenshot Request
Take screenshots of my app at http://localhost:3000 for a Product Hunt launch. I need 5 screenshots showing the dashboard, main features, and settings page.
Authenticated App Screenshots
My app requires login. The login page is at /sign-in. Use email demo@example.com and password Demo123!. After login, screenshot the dashboard and user profile pages.
Full-Page Feature Screenshots
Capture full-page screenshots (not just viewport) of the pricing page and features page. Wait 500ms for animations to complete before capturing.
Dark and Light Mode Variants
Generate screenshots of the landing page in both light and dark mode. Use viewport 1440x900 with 2x retina scaling for marketing use.

Melhores Práticas

  • Use seed or demo data to ensure screenshots show realistic content
  • Always wait for networkidle state to ensure full page loading
  • Use numeric prefixes in filenames for consistent ordering

Evitar

  • Do not commit screenshots with sensitive data to version control
  • Avoid capturing screenshots with personal user data or credentials visible
  • Do not use production URLs without explicit user confirmation

Perguntas Frequentes

Do I need to install Playwright separately?
Yes. Run npm install -D playwright or npm install -D @playwright/test before using this skill.
What resolution are the screenshots?
Screenshots are captured at 2880x1800 pixels using 2x device scale factor for retina quality.
Can this skill screenshot apps that require login?
Yes. Provide your login credentials when prompted, and the skill will authenticate before capturing screenshots.
Where are the screenshots saved?
Screenshots are saved to a screenshots directory in your project root with descriptive kebab-case filenames.
Can I capture screenshots in dark mode?
Yes. If your app supports dark mode, the skill can set the browser color scheme to dark before capturing.
What if my dev server is not running?
The skill will detect if Playwright cannot connect and help you start your dev server before proceeding.

Detalhes do Desenvolvedor

Estrutura de arquivos

📄 SKILL.md