留白（White Space / Negative Space）是设计中最被低估的技巧。很多新手设计师觉得"空着就是浪费"，但恰恰相反 — 好的留白能让设计瞬间提升质感。本文从留白的本质、类型划分、黄金比例到实战应用，帮你掌握这个让设计"呼吸"的核心技能。记住：留白不是"没有内容"，而是"最有用的内容"。
留白，专业术语叫"负空间"（Negative Space），是指设计中有意保留的、不放任何视觉元素的空白区域。这里的"白"不是颜色意义上的白色，而是"空"的意思 — 它可以是任何纯色背景，不一定非要是白色。
| 价值维度 | 具体效果 | 用户感知 |
|---|---|---|
| 可读性 | 增加行距、字距、段距 | 阅读更舒适，信息获取更快 |
| 视觉焦点 | 主体周围大面积留白 | 自动被吸引到核心内容 |
| 高级感 | 整体留白量 ≥ 40% | 专业、精致、值得信赖 |
| 层次划分 | 通过留白量区分信息组 | 一眼看出内容的主次关系 |
| 呼吸感 | 板块之间有充分的间隔 | 不压抑、不拥挤、不焦虑 |
找两张名片设计：一张塞满了文字和图形，另一张只有 Logo 和联系方式。问 10 个人哪张看起来"更贵"。90% 以上的人会选择留白更多的那张。这就是留白最直观的力量 — 它不需要任何额外成本，就能让设计看起来更高级。
留白分为"微观留白"和"宏观留白"，优秀的设计需要同时兼顾两者。
微观留白是元素之间的细小间隙，用户可能不会特别注意到它，但一旦缺失就会感到不适。常见的微观留白包括：
宏观留白是版面中较大的空白区域，是用户一眼就能感受到的"空"。包括：
| 对比项 | 微观留白 | 宏观留白 |
|---|---|---|
| 尺度 | 像素级别（2-20px） | 厘米级别（20-200px） |
| 用户感知 | 隐性感受（不舒服但说不出原因） | 显性感受（一眼看到"好空"或"好挤"） |
| 调整频率 | 全局统一设置（CSS/段落样式） | 逐块调整（根据内容优先级） |
| 优先级 | 先做（基础排版质量） | 后做（视觉层次优化） |
留白不是"越多越好"，也不是"随意留"。以下是经过验证的黄金法则：
借鉴自室内设计的经典配色比例，同样适用于留白规划：
所有间距应该保持倍数关系，让版面有节奏感和韵律感。推荐基础单位为 8px（或 4px），所有间距应为这个单位的整数倍：
相关的元素应该靠近，不相关的元素应该远离。这是格式塔心理学在排版中的直接应用：
标准名片（90 × 54mm）留白建议：
四周安全边距：5mm（距裁切线）
Logo 周围留白：≥ Logo 宽度的 50%
文字行间距：字号的 1.5 倍
信息组间距：4-6mm
建议留白占比：40-60%
核心原则：一面只做一件事 — Logo 面只放品牌信息，联系面只放联系方式
不同场景对留白的需求不同，不能一刀切：
| 设计类型 | 留白占比 | 关键留白区域 | 注意事项 |
|---|---|---|---|
| 名片 | 40-60% | Logo 周围、四周安全边距 | 宁少勿多，只放最核心信息 |
| 企业画册 | 35-50% | 图片周围、页边距、章节间 | 图片本身就是最好的"留白" |
| 产品海报 | 30-45% | 产品周围、标题上方 | 产品需要"呼吸空间"才能突出 |
| 网页落地页 | 40-55% | 首屏 Hero 区、CTA 按钮周围 | 首屏留白直接影响转化率 |
| 电商详情页 | 25-35% | 产品信息块之间 | 留白不能太多，要平衡信息密度 |
| PPT 演示文稿 | 45-60% | 每页核心内容周围 | 每页只说一个观点，留白辅助聚焦 |
表现：页面各处的空白大小不一，没有统一的间距体系，导致版面杂乱无章。
解决方案：建立间距系统（Spacing System）。选择 4px 或 8px 为基础单位，所有间距都使用这个单位的整数倍（4、8、16、24、32、48、64...）。这样整个版面会自然产生节奏感。
表现：页面四周留白很多，但内容内部塞得满满当当，行距紧、段距小、元素拥挤。
解决方案：先调整微观留白（行距、字距、段距），再调整宏观留白。记住：内部留白比外部留白更重要，因为它直接影响阅读体验。
表现：内容本身没有逻辑组织，单纯靠加大间距来"假装"有层次。
解决方案：先用网格系统和信息架构把内容组织好，再用留白强化已有的层次结构。留白是"放大器"，不是"创造者"。
表现：PC 端的留白在手机上显得过大，导致一屏看不到多少内容。
解决方案：移动端留白应为 PC 端的 60-70%。例如 PC 端区块间距 64px，移动端调整为 32-40px。但不要无脑缩放 — 关键区域（如 CTA 按钮周围）的留白要保持。
Apple 官网：产品周围大面积留白，让产品成为唯一焦点，留白占比超过 60%。
MUJI 无印良品：将留白做到极致，产品图周围几乎全是空白，传达"少即是多"的品牌哲学。
原研哉《设计中的设计》：书中大量使用留白，证明留白本身就是一种设计语言。
Google 搜索首页：极简到极致 — 一个 Logo、一个搜索框、两个按钮，留白占比超过 80%。