ui设计移动端字体适配_移动端UI设计规范

一、边距、间距

原则：边距(左右)要大于间距(上下)。

模块边距

10px、12px、15px、16px

15px 常用

10px 最小，要展示更多的内容才用

模块间距

8px、10px、15px、16px、20px

常用 10px 15px 20px

内容间距

5px 10px 15px

内容边距

5px 10px 15px

列表

最小高度 40px

单行 53px 55px 66px

二、全局规则

图片比例

16:9、4:3、3:2、1:1 和 1:0.618(黄金比例)。

字体​

原则：在同一个系统的 UI 设计中先建立体系化的设计思路，对主、次、辅助、标题、展示等类别的字体做统一的规划，再落地到具体场景中进行微调。少即是多，在视觉展现上用尽量少的样式去实现设计目的。避免毫无意义的使用大量字号、颜色、字重强调视觉重点或对比关系。

字重，只出现 regular 以及 medium 的两种字体重量，分别对应代码中的 400 和 500，在英文字体加粗的情况下采用 semibold 的字体重量，对应代码中的 600。

字号选择在 3-5 种之间，保持克制的原则。

行高 1.412px 提示语

14px 主文字

16px 标题

18px 大标题

20px 最大标题

颜色

确定主题色，定义好字体、背景、禁用、线条边框、红橙黄绿蓝等色值。

每种色值最多配有 2~3 种浅谈变化，比如文字可有主、次