← All templates

轨道图 <Orbit />

右边是两圈轨道,中心一个深色图标,4–8 个彩色图标分布在内外圈上;左边是标题、导语和要点。

Template and style descriptions are currently available in Chinese only.

Group
结构 · 一个核心和围绕它的东西
Component
Orbit · #orbit

Good for

  • 生态、集成、技术栈、合作方
  • 说明“这些都连到同一个东西上”

Avoid when

  • 节点之间有先后或依赖:用 FlowDiagram
  • 超过 8 个节点

Content limits

1nodes 4–8 个,label ≤ 6 字
2points 0–3 条,每条 ≤ 22 字
3center.label ≤ 8 个字符

Fields

FieldType
kicker · requiredstring小节名,2–8 字
title · requiredstring | string[]标题;数组手动断行
leadstring一两句导语,≤ 60 字
sourcestring事实出处
center · required{ icon, label }中心
nodes · required{ icon, label }[]轨道上的节点
pointsstring[]左侧要点

Example

<Orbit
  kicker="技术栈"
  title="一个文件,背后这几样"
  center={{ icon: 'presentation', label: 'slidehtml' }}
  nodes={[{ icon: 'code', label: 'React 19' }, { icon: 'bolt', label: 'Vite 8' }]}
  source="package.json"
/>