# 新粗野（Neo-Brutalism）

镜语 · 版式与界面 / 材质与质感

- 别名：新粗野主义、Neubrutalism、粗野风网页、硬阴影风
- 口语：「粗黑边框加硬阴影」「大色块、很张扬有个性」「像贴纸一样歪着贴上去」
- 一句话：粗黑描边、错位硬阴影和高饱和色块，故意显得直接、张扬
- 是什么：新粗野（Neo-Brutalism / Neubrutalism）是 2020 年代流行的界面风格：粗黑描边、不模糊的错位硬阴影、高饱和平涂色块和大号粗体字，刻意显得直接、不修饰。NN/g 把它描述为在扁平化基础上加回强烈对比与个性
- 缺了就不像：粗黑描边；错位硬阴影（无模糊）；高饱和平涂色块
- 加了更像：按下位移；旋转贴纸；超粗大字；等宽小字
- 适合用在：个人主页、独立产品、创意工作室和活动页，需要个性和记忆点；面向年轻用户的内容产品，强调态度；视频封面和信息图，粗边框在小尺寸下依然清楚
- 看哪里：看每个元素都有 2–3px 黑色描边，阴影是向右下错开的纯黑块，没有任何模糊；按下按钮时它会移到阴影的位置，像被压进去。旋转的贴纸和高饱和色块让页面显得活泼
- 注意：不要每个元素都换一个颜色并旋转，没有网格就会变成杂乱；与粗野主义建筑、早期网页粗野主义区分：后者是裸露结构，常常不讲美观
- 描述示例：做一个新粗野风格（Neo-Brutalism）的个人主页：奶油白 #fffbe6 背景，所有卡片、按钮和图片都有 3px 纯黑描边和向右下偏移 5px 的纯黑硬阴影（不模糊）；用高饱和平涂色块（明黄 #ffd23f、粉 #ff6b9d、天蓝 #5ac8fa）；超粗大号无衬线标题，等宽小字标注；按钮按下时位移到阴影位置；加一两枚略微旋转的贴纸标签；整体直接、张扬、好玩
- 易混：
  - [粗野主义建筑](https://idea.ameng.dev/terms/brutalism.md)：粗野主义建筑讲裸露混凝土与结构；新粗野是界面上的粗边框、硬阴影与亮色
  - [孟菲斯](https://idea.ameng.dev/terms/memphis.md)：孟菲斯重在几何装饰图案，新粗野重在描边和硬阴影的组件
  - [扁平化](https://idea.ameng.dev/terms/flat-design.md)：两者都用平涂色，新粗野加回了黑描边和硬阴影来强调边界
- 相关：[波普艺术](https://idea.ameng.dev/terms/pop-art.md)、[投影](https://idea.ameng.dev/terms/drop-shadow.md)、[早期网页](https://idea.ameng.dev/terms/web-1-0.md)

## 来源与延伸阅读

- [NN/g · Neobrutalism](https://www.nngroup.com/articles/neobrutalism/)

网页版（含演示）：https://idea.ameng.dev/terms/neo-brutalism