Carbon
カーボン / 2016– / 风格 / 设计体系
IBM 公开发布并持续维护的设计语言,是把 IBM Design Language 落到产品上可用的形态。骨架有三样,以 8px 最小单位除以二或乘以二来定尺寸的 2x 栅格、IBM Plex 字体,以及把灰色块面当作层层叠起、只留一种核心蓝给操作的配色。
几乎不用圆角的矩形部件,输入框只在下边画一条线 / 白与 #f4f4f4 的面交替叠起,每上一层,底色的明度就动一档 / 只有一种蓝 #0f62fe,且只出现在可以操作的地方,其余几乎都是无彩色 / 从标题到注文全由 IBM Plex 一族排成,不混入别的字体
辞典词条
- 适用场景
- 要让面向企业的管理界面在浅色和深色主题下都不必重新设计地推出时;要把留白和栏宽的依据说得清楚,从而让多个团队的界面整齐一致时
- 字体
- 统一用 IBM Plex,产品界面用紧凑的 productive 一组,读物用较大的 expressive 一组。字号不自己定,从既有的级数里挑。
- 版面
- 以 8px 最小单位为准。栏数从一开始不断对半分下去,外留白和内留白都取最小单位的整数倍。
- 材料
- 把灰色的面当作层叠起来,换层的地方底色明度就动一档。蓝色只用在可以操作的地方,警示色另行留出。
- 注意
- 把颜色写成固定的十六进制值,一切换明暗主题层与层的关系就散了,因为整套体系的前提是按角色名来选色。
- 延伸阅读
- Carbon の 2x Grid の解説にある mini unit の考え方 / productive と expressive という2つの型セットの使い分け / White テーマと Gray 100 テーマで層モデルがどう反転するか
相关词条
引用此条目
这部辞典就是用来被链接的。请取用适合你写作场合的那一种形式。
- Link
- https://indexstyle.org/zh/styles/carbon
- Markdown
- [Carbon — IndexStyle](https://indexstyle.org/zh/styles/carbon)
- HTML
- <a href="https://indexstyle.org/zh/styles/carbon">Carbon — IndexStyle</a>