用途：在开发或修改任何视觉元素（组件、页面、布局、样式）时，通过 Playwright 截图与 Compodium 对改动进行视觉验证，不单纯依赖代码判断 UI 效果。
主要能力：用 Playwright 对完整页面或单个组件截图并查看结果；用 Compodium 在隔离环境中预览组件，它自动发现 app/components/ 下的所有组件，无需编写 stories。
使用方式：先在后台启动开发服务器 bun run dev，等待服务就绪（监听 localhost:3000 或下一个可用端口）。验证页面与布局时使用 npx playwright screenshot --wait-for-timeout=3000 http://localhost:3000/your-page /tmp/screenshot.png，再用 Read 工具查看截图。组件预览地址为 http://localhost:3000/compodium/devtools，可截图该渲染器检查特定组件。
常用参数：--wait-for-timeout=3000 等待水合与渲染；--viewport-size=375,812 移动端视口；--viewport-size=1280,720 桌面视口；--full-page 截取整页可滚动内容；--color-scheme dark 强制深色模式，深色模式也可通过 ?dark=true 或在应用中切换后二次截图。
迭代流程：做出视觉改动后截图受影响的页面或组件，查看截图核对结果，不符预期则调整并重复，直到视觉输出符合意图再继续。
限制：资料未提供该技能的安装方式、依赖版本、兼容范围与费用信息。