知识干货 把这 10 个技巧学会，你就是界面设计大神

朋友们，好久不见！
这个月一直周旋于周年庆的事情
差点忘了自己是一枚合格的设计师了。

话不多说，干货走起！

别用「死黑」当背景！

别再用纯黑当背景，看起来真的很压抑，换成深灰色，一下子透气好多，高级感也来了，这是特别适合工业的深色界面！

同色系 YYDS！深浅搭配不出错

在设计深色模式设计界面时，会遇到需要在暗色的背景上加深色卡片的情况。只要在本来的色相上降低亮度值，这个界面的颜值就稳了。

别死磕对齐，眼睛说了算！

一样大的方形和圆形放一起，圆形总会显小一丢丢～所以记得把圆形稍微调大点，视觉上才能平衡！

间距就按偶数来！

使用 8 的倍数来表示元素之间的间距，因为大多数开发人员会使用 8 点网格来进行页面布局，这样既能有效减少错误并简化开发过程。

投影模糊值等于 2 倍 Y 轴大小！

阴影别乱调！Y 轴多高，模糊值就设它的 2 倍，效果自然又舒服～

深色背景，颜色得「降噪」

大红大绿放在黑底上简直亮瞎……把饱和度调低一点，整体柔和，眼睛不累。

按钮边距：垂直是水平的 2 倍！

垂直边距是水平边距的 2 倍时，看起来更完美。例如，按钮有 12px 的垂直填充(顶部，底部)和 24px 的水平填充(右侧，左侧)，那么这个按钮看起来就是比较舒服的。

大小写也有讲究！

主要按钮使用标题大小写，因为它是需要被强调的按钮。标题大小写就是将每个单词的第一个字母大写。而在标签、状态和其他类似元素中可以使用全大写，凸显出干净而精确的外观，从其他元素中脱颖而出，同时要记住设计的整体视觉平衡。

渐变用线性，别用径向！

大多数 UI 元素都是方形的，所以使用径向渐变有时会在设计中看起来不合适或不平衡。相反，使用线性渐变可以在设计中创造一种深度和对比感。同时，线性渐变在深色界面中特别有用。

输入框和按钮一样高！

为了保持视觉风格一致，输入框的高度和主要操作按钮的高度可以相同，这样我们就会拥有一个干净的界面。