Cydekick — Animated mark

Option A · Inline SVG (recommended)

Paste this SVG directly into your HTML/JSX. The animation runs natively. This is what you'll use in your sign-in / splash pages.

Animation working ✓

Option B · Static SVG + CSS spin (simplest)

Use the static mark-primary.svg with a CSS class that spins the whole element. Works with <img> tags directly.

img + CSS spin ✓

<img src="mark-primary.svg" class="cydekick-spin" />

<style>
  .cydekick-spin {
    animation: cydekick-spin 8s linear infinite;
    transform-origin: center;
  }
  @keyframes cydekick-spin {
    to { transform: rotate(360deg); }
  }
</style>

Sign-in usage example

Note: Option B spins the entire mark including the navy background. If you want only the satellites to rotate (the way it's designed), use Option A inline.