ui-neumorphic-design
Apply soft neumorphism (拟态风格) UI design guidelines. Use when designing UI screens/components or when the user mentions neumorphism/拟态风格/soft UI.
Best use case
ui-neumorphic-design is best used when you need a repeatable AI agent workflow instead of a one-off prompt.
Apply soft neumorphism (拟态风格) UI design guidelines. Use when designing UI screens/components or when the user mentions neumorphism/拟态风格/soft UI.
Teams using ui-neumorphic-design should expect a more consistent output, faster repeated execution, less prompt rewriting.
When to use this skill
- You want a reusable workflow that can be run more than once with consistent structure.
When not to use this skill
- You only need a quick one-off answer and do not need a reusable workflow.
- You cannot install or maintain the underlying files, dependencies, or repository context.
Installation
Claude Code / Cursor / Codex
Manual Installation
- Download SKILL.md from GitHub
- Place it in
.claude/skills/ui-neumorphic-design/SKILL.mdinside your project - Restart your AI agent — it will auto-discover the skill
How ui-neumorphic-design Compares
| Feature / Agent | ui-neumorphic-design | Standard Approach |
|---|---|---|
| Platform Support | Not specified | Limited / Varies |
| Context Awareness | High | Baseline |
| Installation Complexity | Unknown | N/A |
Frequently Asked Questions
What does this skill do?
Apply soft neumorphism (拟态风格) UI design guidelines. Use when designing UI screens/components or when the user mentions neumorphism/拟态风格/soft UI.
Where can I find the source code?
You can find the source code on GitHub using the link provided at the top of the page.
SKILL.md Source
# 轻拟物(拟态风格)UI 设计 ## 适用场景 - 当需要进行 UI 设计或优化 - 当用户明确要求拟态风格/轻拟物/soft UI ## 设计步骤 1. **背景与元素关系** - 背景色与元素色接近,避免强烈对比 - 例:背景 `#F0F0F0`,按钮 `#F5F5F5` - 通过阴影与高光让元素“浮”在背景上 2. **双阴影(凸起/凹陷)** - 浅色高光:向上偏移,`#FFFFFF`,透明度 20% - 深色阴影:向下偏移,`#D9D9D9`,透明度 20% - 用于营造凸起或凹陷的立体效果 3. **按钮与卡片** - 凸起按钮:双阴影模拟光照 - 按下时:切换为凹陷效果(内阴影) - 卡片:柔和阴影 + 大圆角,增强层次感 4. **图标与文字** - 图标保持简洁,适度立体感 - 文字使用无衬线字体 - 文字颜色与背景形成轻微对比,确保可读性 ## 输出要求 - 输出 UI 方案时,明确说明:背景色、元素色、阴影参数、圆角与字体建议 - 保持整体低对比、柔和、轻盈的视觉风格
Related Skills
writing-wechat-tech-posts
Writes complete WeChat tech posts (hook, TOC, body, checklists, image placement, layout notes, summaries). Use when the user asks to draft a WeChat tech article, generate reusable prompts for writing, or turn a topic/outline into a publish-ready post.
writing-skills
Use when creating new skills, editing existing skills, or verifying skills work before deployment
writing-plans
Use when you have a spec or requirements for a multi-step task, before touching code
verification-before-completion
Use when about to claim work is complete, fixed, or passing, before committing or creating PRs - requires running verification commands and confirming output before making any success claims; evidence before assertions always
using-superpowers
Use when starting any conversation - establishes how to find and use skills, requiring Skill tool invocation before ANY response including clarifying questions
using-git-worktrees
Use when starting feature work that needs isolation from current workspace or before executing implementation plans - creates isolated git worktrees with smart directory selection and safety verification
titling-wechat-tech-posts
Crafts and rewrites WeChat tech post titles across multiple patterns (list, contrast, outcome, scenario, anti-myth, template). Use when the user needs headline brainstorming or “restrained but clickable” title rewrites for tech/engineering WeChat公众号.
test-driven-development
Use when implementing any feature or bugfix, before writing implementation code
systematic-debugging
Use when encountering any bug, test failure, or unexpected behavior, before proposing fixes
subagent-driven-development
Use when executing implementation plans with independent tasks in the current session
requesting-code-review
Use when completing tasks, implementing major features, or before merging to verify work meets requirements
receiving-code-review
Use when receiving code review feedback, before implementing suggestions, especially if feedback seems unclear or technically questionable - requires technical rigor and verification, not performative agreement or blind implementation