用途:spacing-systems 用于建立可复用的间距体系,让界面在垂直与水平方向上保持统一的空间节奏,减少随意取值。
主要能力:提供两套推荐刻度。Base-4 刻度为 4 8 12 16 20 24 32 40 48 64 80 96 128,理由是 4 可被 2 整除,便于半像素精度并适配常见网格间距。Base-8 刻度为 8 16 24 32 40 48 64 80 96 128,粒度更粗、决策更少,适合留白较大的设计。
典型取值:图标与标签间距 4-8px;输入框内边距垂直 8-12px、水平 12-16px;卡片内边距 16-24px;表单字段之间 16-20px;卡片之间 16-24px;区块外边距 48-96px;移动端页面边距 16-20px;桌面端页面边距 48-96px。
使用规则:只使用刻度中的值,避免魔法数字;标题上方留白多于下方,因为标题归属于其后的内容;相关元素用紧凑间距,不相关元素用宽松间距;同一类组件保持一致的内部留白;记录刻度并通过设计令牌强制执行。
适用场景:设计系统、组件库、页面布局与响应式界面中的间距决策。
限制:资料未提供具体工具集成方式、安装命令、代码实现或平台支持信息,暂未提供。