docs: add playwright example skill for quick start

.opencode/skill/playwright-example/SKILL.md

@@ -0,0 +1,54 @@
+---
+name: playwright-example
+description: Browser automation skill for web testing, scraping, and interaction. Use for end-to-end testing, screenshots, and browser automation tasks.
+argument-hint: describe what you want to do (e.g., "take a screenshot of homepage", "test login flow", "fill out a form")
+mcp:
+  playwright:
+    command: ["npx", "-y", "@playwright/mcp@latest"]
+---
+
+# Playwright Browser Automation
+
+This skill provides browser automation capabilities via the Playwright MCP server.
+
+## Available Operations
+
+The Playwright MCP provides tools for:
+
+- **Navigation**: Navigate to URLs, go back/forward, reload pages
+- **Screenshots**: Capture full page or element screenshots
+- **Interactions**: Click, type, select, hover, and other user interactions
+- **Forms**: Fill out forms, submit data, handle file uploads
+- **Assertions**: Wait for elements, check visibility, verify content
+- **Scraping**: Extract text, attributes, and data from pages
+
+## Usage Guidelines
+
+1. **End-to-End Testing**:
+   - Automate user flows and verify functionality
+   - Test authentication flows
+   - Validate form submissions
+
+2. **Screenshots & Visual Testing**:
+   - Capture screenshots for documentation
+   - Compare visual states before/after changes
+   - Debug UI issues
+
+3. **Web Scraping**:
+   - Extract data from web pages
+   - Navigate through paginated content
+   - Handle dynamic content loading
+
+4. **Form Automation**:
+   - Fill and submit forms
+   - Handle multi-step wizards
+   - Test validation behavior
+
+## Example Tasks
+
+- "Navigate to the login page and take a screenshot"
+- "Fill out the registration form with test data"
+- "Click the submit button and wait for the success message"
+- "Extract all product names from the catalog page"
+- "Test the checkout flow from cart to confirmation"
+- "Take a screenshot of the dashboard after logging in"

README.md

@@ -48,6 +48,22 @@ Or install it locally:
 }
 ```
 
+## Quick Start
+
+This repo includes a working example skill. After installing the plugin, try:
+
+```
+skill(name="playwright-example")
+```
+
+Then use the embedded MCP:
+
+```
+skill_mcp(mcp_name="playwright", tool_name="browser_navigate", arguments='{"url": "https://example.com"}')
+```
+
+See [`.opencode/skill/playwright-example/SKILL.md`](.opencode/skill/playwright-example/SKILL.md) for the full example.
+
 ## Usage
 
 ### 1. Create a Skill with Embedded MCP
@@ -136,6 +152,38 @@ interface McpServerConfig {
 }
 ```
 
+## Example Skill
+
+Here's a complete example of a skill with an embedded MCP server (from [`.opencode/skill/playwright-example/SKILL.md`](.opencode/skill/playwright-example/SKILL.md)):
+
+```markdown
+---
+name: playwright-example
+description: Browser automation skill for web testing, scraping, and interaction. Use for end-to-end testing, screenshots, and browser automation tasks.
+argument-hint: describe what you want to do (e.g., "take a screenshot of homepage", "test login flow", "fill out a form")
+mcp:
+  playwright:
+    command: ["npx", "-y", "@playwright/mcp@latest"]
+---
+
+# Playwright Browser Automation
+
+This skill provides browser automation capabilities via the Playwright MCP server.
+
+## Available Operations
+
+- **Navigation**: Navigate to URLs, go back/forward, reload pages
+- **Screenshots**: Capture full page or element screenshots
+- **Interactions**: Click, type, select, hover, and other user interactions
+- **Forms**: Fill out forms, submit data, handle file uploads
+
+## Example Tasks
+
+- "Navigate to the login page and take a screenshot"
+- "Fill out the registration form with test data"
+- "Extract all product names from the catalog page"
+```
+
 ## License
 
 MIT