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

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

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