Menu
用户交互界面风格设计指南 在涉及任何前端或APP界面编写任务前都务必要阅读此指南
The review-first prompt is selected by default. You can switch to a direct command or download a local copy.
Read SKILL.md and any companion files shown by SkillsMP before deciding whether to install.
Install with Codex or Claude Copy this prompt, paste it into Codex, Claude, or another assistant, and let it review the skill page and install it for you.
A direct command skips the review prompt. Inspect the source before running it.
npx skills add https://github.com/Nixdorfer/ClaudeCodeTool --skill uiThe command stays on one line. Scroll horizontally to inspect it before copying.
Prefer a local copy? Download the files currently available to SkillsMP.
Showing SKILL.md
Based on SOC occupation classification
| name | ui |
| description | 用户交互界面风格设计指南 在涉及任何前端或APP界面编写任务前都务必要阅读此指南 |
根据项目需求选择合适的风格 阅读对应目录下的子文件获取完整规范 每个风格目录包含: base.md(基本要求) colors.md(配色体系) effects.md(特效系统) typography.md(排版规范) animation.md(动画体系)
| 目录 | 风格 | 特征 |
|---|---|---|
| liquid-glass/ | 深色液态玻璃 (默认) | 极暗背景 半透明模糊 绿色强调 苹果质感 |
| cyberpunk/ | 赛博朋克 | 深蓝黑底 霓虹发光 切角设计 故障艺术 |
| space-scifi/ | 太空科幻 | 深空黑底 星空粒子 HUD面板 全息投影 |
| steampunk/ | 蒸汽朋克 | 暗褐底 黄铜金属 齿轮元素 维多利亚衬线 |
| vaporwave/ | 蒸汽波 | 深紫夜底 粉紫渐变 透视网格 Win95风格 |
| 8bit/ | 8-Bit 像素风 | 像素化边框 低分辨率美学 游戏UI 血条经验条 |
| dark-gothic/ | 暗黑哥特 | 深黑紫底 尖拱窗花 烛火光效 铁链蔷薇 |
| japanese-wa/ | 和风日式 | 和纸质感 墨绘水彩 障子格窗 侘寂美学 |
| wuxia/ | 武侠水墨 | 宣纸底纹 毛笔书法 山水画意境 卷轴印章 |
| modern-minimal/ | 现代极简 | 大量留白 细线条 无装饰 功能至上 |
| nature-forest/ | 自然森系 | 纸张木纹质感 树叶元素 手绘风 柔和有机 |
| editorial/ | 报纸排版 | 多栏布局 首字下沉 衬线标题 经典印刷 |
| kawaii/ | 卡哇伊 | 粉彩色系 圆润造型 糖果质感 波浪分区 |
| memphis/ | 孟菲斯 | 大胆几何 高饱和色块 粗边框 偏移阴影 |
| tropical/ | 热带度假 | 渐变天空 波浪分区 棕榈树 明快色彩 |
| western-fantasy/ | 西方奇幻 | 石质纹理 金色装饰 魔法符文 中世纪衬线 |