المهارات screenshots
📸

screenshots

مخاطر منخفضة ⚙️ الأوامر الخارجية🌐 الوصول إلى الشبكة📁 الوصول إلى نظام الملفات

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.

يدعم: Claude Codex Code(CC)
📊 71 كافٍ
1

تنزيل ZIP المهارة

2

رفع في Claude

اذهب إلى Settings → Capabilities → Skills → Upload skill

3

فعّل وابدأ الاستخدام

اختبرها

استخدام "screenshots". Generate 5 marketing screenshots of my Next.js app at localhost:3000

النتيجة المتوقعة:

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.

استخدام "screenshots". Screenshot the pricing page after clicking the annual toggle

النتيجة المتوقعة:

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

التدقيق الأمني

مخاطر منخفضة
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
الملفات التي تم فحصها
402
الأسطر التي تم تحليلها
6
النتائج
1
إجمالي عمليات التدقيق
مشكلات منخفضة المخاطر (3)
SKILL.md:24-26SKILL.md:158-160SKILL.md:283-285
External Command Execution
Skill executes shell commands for Playwright operations and file management. Commands are standard development tooling with hardcoded arguments.
SKILL.md:74-77
User Credential Collection
Skill prompts users for login credentials (email, password) to access authenticated pages for screenshots. Credentials are used in generated scripts.
SKILL.md:40-43
Localhost Network Access
Skill accesses localhost URLs provided by users for screenshot capture. This is expected behavior for a web app screenshot tool.

عوامل الخطر

⚙️ الأوامر الخارجية (5)
SKILL.md:24-26 SKILL.md:158-160 SKILL.md:283-285 SKILL.md:288-290 SKILL.md:361-364
🌐 الوصول إلى الشبكة (1)
SKILL.md:40-43
📁 الوصول إلى نظام الملفات (1)
SKILL.md:158-160
تم تدقيقه بواسطة: claude

درجة الجودة

38
الهندسة المعمارية
100
قابلية الصيانة
87
المحتوى
50
المجتمع
84
الأمان
91
الامتثال للمواصفات

ماذا يمكنك بناءه

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.

جرّب هذه الموجهات

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.

أفضل الممارسات

  • 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

تجنب

  • 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

الأسئلة المتكررة

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.

تفاصيل المطور

المؤلف

sickn33

الترخيص

MIT

المستودع

https://github.com/sickn33/antigravity-awesome-skills/tree/main/web-app/public/skills/screenshots

مرجع

main

بنية الملفات

📄 SKILL.md