القائمة
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