STARCK UI

Provider Orbit

A reduced-motion-aware integration orbit that pauses when someone inspects it.

Used inMoorline ↗
S
GH
SL
L
N
F
Your app
  • Stripe
  • GitHub
  • Slack
  • Linear
  • Notion
  • Figma

Install

Add the source directly to your shadcn project.

pnpm dlx shadcn@latest add https://ui.starck.studio/r/provider-orbit.json

Usage

<ProviderOrbit
  center="Your app"
  duration={32}
  items={[
    { name: "Stripe", icon: <span style={{ color: "#635bff" }}>S</span> },
    { name: "GitHub", icon: <span style={{ color: "#18181b" }}>GH</span> },
    { name: "Slack", icon: <span style={{ color: "#611f69" }}>SL</span> },
    { name: "Linear", icon: <span style={{ color: "#5e6ad2" }}>L</span> },
    { name: "Notion", icon: <span style={{ color: "#111827" }}>N</span> },
    { name: "Figma", icon: <span style={{ color: "#f24e1e" }}>F</span> },
  ]}
/>