留白优先
需要把两块内容分开时，先试着拉开距离。距离不够用了，再考虑加线。
你会遇到的现象
- 页面上框套着框，线比内容还多
- 每加一个模块就给它加个卡片，最后满屏都是卡片
- AI 生成的界面每两行之间都有一条分割线
分割线和边框是「画出来的分隔」，间距是「让出来的分隔」。两者效果一样，但前者增加视觉元素，后者不增加。同样能表达分组，为什么要多画一堆线。
更重要的是，线用多了会失效。当页面上每个模块都有边框，边框就不再传递「这是一组」的信息，只是背景噪音。
什么时候还是要线
| 情况 | 为什么这时候要线 |
|---|---|
| 表格的行与行 | 需要横向对照，线帮眼睛保持在同一行上 |
| 空间不够拉开距离 | 移动端一屏内容多，没有足够空间做间距 |
| 需要明确的可点边界 | 输入框、按钮，用户要知道点哪儿 |
| 内容浮在别的内容上 | 弹窗、抽屉、下拉菜单，需要跟底下的内容分开 |
| 并列的多个卡片 | 数量多且要区分彼此时，边框比间距更省地方 |
怎么用留白分区
- 组内 8，组间 24。差三倍是个安全的起点。同一组内的元素靠得紧，不同组之间拉开（见一套间距）。
- 标题跟自己的正文离得近，跟上一组离得远。这一条错了，分组关系会被读反。
- 先删再加。做完一个界面，试着把所有边框和分割线删掉，看还能不能分清结构。分不清的地方再加回来，通常会发现只要加回三成。
- 大区块之间给足空间。桌面端 40 到 64px 不算多。页面显得挤，通常不是内容多，是留白不够。
留白不是空着不用，它在表达关系。一块空白告诉用户「这里结束了，下面是新的一段」——这个信息本身就是内容。