跳到内容

看哪里 看所有元素都是纯色:头像是圆形裁切,统计数字直接写在色块上,按钮没有阴影也没有高光,只靠颜色和文字区分。点按钮时只改颜色,作品格子的悬停也只是色块覆盖,没有任何立体变化

这是什么

扁平化是去掉阴影、纹理、高光和渐变,只用纯色块、清晰字体与简单图形组织界面的风格。2010 年代初由 Windows Phone Metro 与 iOS 7 推向主流;后来的「Flat 2.0」又加回少量阴影来提示可点击

也叫扁平设计Flat UI扁平风Metro 风格

关键特征

缺了就不像
纯色块没有阴影和高光简单几何图标
加了更像
高饱和配色粗细对比的无衬线字长投影图标(Flat 2.0)

容易混淆

扁平化Flat Design

去掉阴影、纹理和高光,只用纯色块、清晰字体和简单图标

你可能会说

  • 纯色块、没有阴影的那种
  • 图标都是简单的平面色块
  • 像 iOS 7 之后那种干净

适合用在

  • 信息清晰优先的产品界面、图标体系、数据看板
  • 视频里的信息图、说明动画,与扁平插画配合
  • 需要在小屏幕上快速识别的按钮和图标

这样描述给 AI

做一个扁平化风格(Flat Design)的个人主页卡片:完全不用阴影、渐变、纹理和高光;用 3–4 个高饱和纯色(如青绿 #1abc9c、深蓝 #34495e、珊瑚红 #e74c3c)大面积铺色块,直角或小圆角;无衬线字体,标题粗、正文细;图标是单色几何剪影;按钮是纯色块加白字,悬停只改颜色深浅;信息靠颜色块和留白分组