小巧简洁的图形资源,可增强关键网页组件,快速有效地传达理念。

直观、实用、几何化——我们的象形图将理念提炼至最纯粹的形式,传达清晰的目的与永恒的简洁。
Spaceship 象形图有两种类型:常规型和comp 型。comp 类型将常规象形图与 Spaceship 图标库中的图标结合,使我们能够表达更复杂和特定的概念。
所有 Spaceship 象形图均有两种版本:填充型(主用)和描边型(次用)。当象形图需要比周围的象形图、文本或 UI 组件更弱的视觉权重时,仅应使用描边版本。这有助于在复杂布局中建立视觉层级。
象形图基于一套规则,从基础网格到渐变和描边参数,确保结果的一致性和平衡性。
Spaceship 象形图设计为可缩放,保持视觉一致性并确保最佳可读性。我们的设计系统中有五种象形图尺寸。
象形图通常只使用单一色调。唯一的例外是 comp 类型,它可以包含品牌色或通知色,相关信息请见下文。为确保 UI 场景中的一致性,象形图遵循 Spaceship 设计系统的色彩规范。

灰色是象形图的默认颜色,应用于表示消息、操作或功能。在特殊情况下,也可用于产品。描边样式的象形图仅提供默认颜色。
SPS 蓝色、SPS 深灰色或白色也可替代默认颜色,用于需要更强视觉冲击力或强化 Spaceship 品牌形象的场合。更多详情请参阅色彩页面。
在产品专属场景(如产品页面、产品卡片等)中,所有当前及未来产品的象形图应使用主要产品色。
这些颜色应用于强化通知信息。comp 版本仅适用于通用系统消息,不应用于警告状态。
以下是创建和使用象形图时应避免的一些示例。
不要让常规象形图的关键元素落在右下角。
填充版本中不要使用复杂或多色渐变。
comp 类型中不要混用填充和描边元素。
填充版本中除上述指定颜色外,不要使用其他颜色。
描边版本中除默认颜色外,不要使用任何颜色。
不要将默认颜色与 Spaceship 品牌主色和通知色以外的任何颜色组合使用。