メニュー
Use when UI work benefits from live visual co-editing in Pencil so the user can see, review, and modify structure or layout directly on a .pen canvas.
Codex または Claude でインストール この Prompt をコピーして Codex、Claude、または他のアシスタントに貼り付けると、Skill ページを確認してインストールできます。
SOC 職業分類に基づく
Use when diagnosing central skill repository drift, especially when platform links look inconsistent, .skill-source.json metadata may be incomplete, verify.sh reports issues, or you want a one-command health check before larger maintenance.
Use when maintaining shared ui-polish references, helper scripts, demo assets, or bridge documents that support the ui-polish bundle.
Use when you need the non-negotiable ui-polish rules for UI direction, color, copy, spacing, readability, button feedback, and layout restraint before making interface decisions.
提升 Web、H5、小程序、Chrome 扩展、移动应用、Electron、Tauri 和桌面应用的界面质感、层级与一致性。用于任何涉及页面、组件、弹窗、设置页、面板、工具窗口、仪表盘或设计重构的任务，尤其当用户要求更好看、更高级、更有质感、更专业、减少 AI 味时。
Use before claiming a UI is done, polished, or good-looking to run the ui-polish blocking checks, lightweight validation, and final visual review.
UI/UX design intelligence for web and mobile. Includes 50+ styles, 161 color palettes, 57 font pairings, 161 product types, 99 UX guidelines, and 25 chart types across 10 stacks (React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind, shadcn/ui, and HTML/CSS). Actions: plan, build, create, design, implement, review, fix, improve, optimize, enhance, refactor, and check UI/UX code. Projects: website, landing page, dashboard, admin panel, e-commerce, SaaS, portfolio, blog, and mobile app. Elements: button, modal, navbar, sidebar, card, table, form, and chart. Styles: glassmorphism, claymorphism, minimalism, brutalism, neumorphism, bento grid, dark mode, responsive, skeuomorphism, and flat design. Topics: color systems, accessibility, animation, layout, typography, font pairing, spacing, interaction states, shadow, and gradient. Integrations: shadcn/ui MCP for component search and examples.
| name | ui-pencil |
| disable-model-invocation | true |
| description | Use when UI work benefits from live visual co-editing in Pencil so the user can see, review, and modify structure or layout directly on a .pen canvas. |
Pencil 用于可视化共改，不替代真实实现预览。
get_editor_state 确认当前 .pen 文档和画布batch_get 读现有节点batch_design 做结构化修改get_screenshot 及时复查references/pencil-workflow.mdreferences/pencil-rules.md