Radius 圆角

页面模块、元素的圆角数值,通过圆角来传递设计语言,表现风格调性

圆角参数

应用于所有基础圆角卡片场景为16px、12px,为了统一视觉语言与需严格克制使用

16px

12px

*由于交易页面特殊性,该规范不适用于交易页主页,交易页附属页面可遵循以上规则

圆角规范

使用范围:

16px

Level 1 卡片圆角

12px

Level 2 卡片圆角

叠加规范

卡片叠加

当叠加关系时,严格遵循内部卡片圆角要小于外部卡片圆角的准则

12px

16px

*若有特殊定制诉求,使用以 4px 倍数为基准的圆角大小定义卡片规则(自定义前务必咨询DS)

组件圆角参数(由DS 维护)

应用于所有组件上的圆角,场景为8px、4px,为了统一视觉语言与需严格克制使用

Large size

Small

Small

全圆角

8px

4px

输入框、选择器、下拉菜单、日期选择器、分段控制器、文字气泡、气泡卡片、气泡确认框、通知提醒框、警告提示、全局提示……

复选框、标签、分页器 ……

小红点、按钮……

DESIGN

中文