新拟态Neumorphism
设计风格用同色阴影做出凸起和凹陷
新拟态让按钮和卡片看起来像从背景中凸出或凹下，视觉比较柔和，但边界和可点击状态容易不清楚。它更适合展示页面或局部装饰，关键操作要先保证对比度与识别性。
HOME / LIVING ROOM晚安模式22:41
室内温度24°舒适
空气质量优
夜间氛围已开启
设计原则 · Principles
- 使用方向相反的一浅一深两道阴影表现凸起
- 背景与组件可以接近同色，但边界仍要能够识别背景按钮
- 凸起和凹下可以辅助表达状态，不能成为唯一信号可按已按
- 圆角与柔和阴影要和组件尺寸保持协调♪▶
- 在文字、焦点和关键操作上优先满足对比度要求看清我了吗
什么时候用
- 音乐播放器等重氛围、低操作密度的界面⏮▶⏭
- 概念稿和作品集，用于展示材质方向◐
- 真实产品中的一小块装饰或控制区域正常界面里嵌一张新拟态卡，点到为止
- 时钟、天气等以查看为主的小组件12:30
什么时候不用
- 长篇正文使用低对比灰色文字和背景灰色正文和相近背景会降低长文可读性。
- 输入框与背景没有边界，用户难以发现姓名？按钮？
- 关键按钮只靠浅阴影表达可点击状态立即购买
- 没有验证对比度，就用于核心产品流程阳光下
发展历程 · History
2019.12
Dribbble 一夜爆红
设计师 Alexander Plyuto 的银行 App 概念稿刷屏：同色背景上「挤出来」的按钮，点赞破纪录。
2020
风潮顶峰
被命名为 Neumorphism（也叫 Soft UI）：教程、UI kit、在线生成器遍地，几乎每个设计师都画了一版。
2020—2021
可用性集体批评
对比度远低于 WCAG 标准、按钮和背景分不清、阳光下直接消失——真实产品几乎零采用。
今天
回归装饰
退守音乐播放器、概念稿、局部点缀，作为「好看不能用」的经典反面教材留在设计史里。
组成结构 · Anatomy
同色底 #e3e9f2
↖ 白色柔光
↘ 灰蓝暗影
柔和大圆角
凹陷按下
1同色背景Same-color Base背景与所有元件同享一个色（经典 #e3e9f2），这是「软」的前提，也是灾难的起点
2白色柔光Light Shadow负偏移的白色阴影（约 -6,-6），假装光源从左上角打过来
3灰蓝暗影Dark Shadow正偏移的灰蓝阴影（约 6,6），与柔光对偶，挤出立体感
4柔和大圆角Soft Radius圆角 12–20px 起步，边缘要糊，直角会破坏「软」的错觉
5凹陷状态Inset Pressedbox-shadow 改 inset 即凹下，用来表示已按、滑槽与输入框
AI 提示词 · Prompt
新拟态界面，同色背景 #e3e9f2，一深一浅两道柔阴影，挤出浮雕按钮，柔和大圆角，neumorphism, soft UI, same-color background, dual soft shadows, extruded buttons, low contrast aesthetic典型使用场景
新拟态氛围家居
HOME / LIVING ROOM23:14
室内温度24°舒适
阅读灯40% brightness
夜间氛围已开启
低风险控制 · 关键安全设备不使用新拟态
新拟态概念控制面板
◐
♪
Dribbble 概念稿 · 展示功力，不上线
真实产品里的局部点缀
整页新拟态（反面示范）
登录
邮箱
密码
登录
↑ 找出输入框和登录按钮——这就是它不能上线的原因