Linear

近黑色基底、紧密字距与产品图像展示。
页面以近黑色为基底,搭配白色文字。字体采用 Inter Variable、Berkeley Mono。视觉特点包括紧密字距、产品图像展示、大字排版、宽松留白。适合参考的场景:技术产品首页、开发工具说明页。
查看原始网站使用规范
建议采用
- 使用 Inter Variable 字体,并开启 font-feature-settings 'cv01'、'ss03'、'zero' — 这些替代字形定义了 Linear 的排版特征
- 仅使用#e4f222作为视图中的单一主要操作色——绝不用于装饰,也绝不用于次级按钮
- 正文文字设为16px Inter 400字重,行高1.5——更大字号(17px及以上,字重590)仅用于强调性文本块
- 在48px及以上字号时使用-0.022em字间距——显示文本的字间距必须保持极紧,不可妥协
- 卡片圆角设为12px,按钮圆角设为6px,胶囊形控件圆角设为9999px——三个圆角值构成了整个系统的圆角语汇
- 使用0.5px细线边框(#23252a或#383b3f)替代阴影进行表面分隔——Linear的层次感来自边框和细微的内嵌阴影
- 保持区块间距为96px,元素间距为8px——8/12/24/96的间距阶梯构成节奏
建议避免
- 不要使用粗体字重(700及以上)——Linear的字重体系最高仅到590,系统刻意避免使用厚重的显示字重
- 不要在按钮、卡片或文本上使用装饰性渐变——渐变仅用于首屏氛围背景
- 不要引入额外的色彩强调作为操作提示——电酸青色按钮是唯一的彩色UI元素
- 不要在卡片或面板上使用大圆角(16px及以上)——本系统中卡片最大圆角为12px
- 不要使用阴影来分隔卡片与画布——应使用细线边框(#23252a)和内嵌凹陷阴影替代
- 不要使用彩色文字用于正文——所有正文文字位于#d0d6e0 / #8a8f98 / #62666d灰度色系内
- 不要使用Berkeley Mono用于标题或营销文案——它仅保留用于问题编号、键盘快捷键和技术元数据