app ui设计规范

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接: https://blog.csdn.net/wangchun159753/article/details/101053480

尺寸:720*1280

间距:20px, 24px,32px, 点线面尽量保持一致

颜色

基准标准色:品牌色,全局button,文字链接
基础文字色:#333333,正文,标题;#666666 简介;#c8c8c8 没有下一页等提示
全局标准色:#F5F5F5 / #F8F8F8,上下导航栏分割线,输入框填充;#F5F7FA 背景色

字体

tab顶部,选中20px 行高28px;未选中18px,行高24px
tab底部,选中和未选中一致,14px 行高18px
列表主分类标题:20px, 行高28px
列表一级标题:18px,行高24px
列表简介/内容:16px, 行高20px / 12px, 行高16px

行间距:10px,20px

按钮

默认:#FFFFFF
点击: 叠加遮罩层 #000000, 不透明度20%
禁用:叠加遮罩层 #FFFFFF 不透明度50%

button圆角度:12px
button大中小三种尺寸

图片

图片比例:1:1, 2:1, 4:3, 16:9
图片圆角度:10px
头像尺寸:6464, 100100,140*140

图标尺寸

图标本身40px,切图图标48px

导航

顶部导航: 高度88px, 背景色 #FFFFFF,导航分割线颜色值:#E9E9E9
底部导航:文字默认22px
二级导航:文字默认28px

卡片相关

卡片间距 20px
左右间距 24px
标题 30px #333333
价格:#FF5339 28px 26px

猜你喜欢

转载自blog.csdn.net/wangchun159753/article/details/101053480