颜色color
品牌色
中性色
辅助色
填充 Fill
文案 Text
线条 Line
功能色
成功 Success
警告/提醒 Warning/Notice
错误 Error
链接 Link
间距Space
基于 4px 刻度, 我们分别抽离了一套常用的间距体系,<br><br>小间距 4px、8px、12px:常用于信息展示型的内容,且具有亲密的主次关系之间排布。<br><br>常规间距 16px、20px、24px:常规间距应用于大部分场景的排布,如标题上下间距,模块容器之间的间距。<br><br>大间距 32px、40px、48p:大间距用于相对疏离模块的排布或无分割线,需要使用大间距区分模块。<br><br>相关性越强的元素之间间距越小,关联性越弱则间距越大。设计者可根据内容整体的致密和疏松偏好,灵活配置这三种间距对应的的具体数值。
圆角Radius
2px
输入框,按钮等基础组件;栏目容器:下拉菜单,卡片,气泡,弹窗
全圆角
需要特别突出或需要点缀差异化设计的按钮、输入框组件等
阴影 Shadow
Shadow-0 零度 无投影数值,一般用于常规控件<br>
Shadow-1 低度 常用于突出页面栏目模块,页面框架结构的划分搭建
Shadow-2 常规 常用于水平面元素悬浮状态,如卡片hover状态、气泡提示框
Shadow-3 高度 常用于模态弹窗等高于页面的元素