An isometric cube reduced to its silhouette — three faces, three engines, one centre vertex. Nine visible edges, seven vertices. Below: production assets, then fifteen states across four motion categories.
9 edges · 7 vertices · 3 faces
Assets
Three SVG sources optimised for different render contexts; PNGs at every standard size; multi-resolution favicon and Apple touch icon. Click any card to download.
Lifecycle
From first paint to milestone reveal. One-shots fire on transitions; warming-up loops while data loads.
01 — Steady
Default
Resting cube. Full ink, no motion. Three faces meet at the centre vertex.
ink #333 · static
02 — Build
Loading
Cube unfolds. Centre first, then 3 near corners with their spokes, then 3 far corners closing the silhouette.
1100ms · centre → near → far
03 — Indexing
Warming up
Whole cube breathes slowly at reduced opacity. Loops while textbooks index, while the school's data is being absorbed.
2400ms · ease-in-out · loop
04 — Promotion
Day 14 transition
Calibration completes. Amber settles into ink — the agent moves from drafting-only to its saved autonomy tier.
amber → ink · 1500ms · replay 5s
05 — Reveal
Bloom
Cube scales up from a tight 50% with rising opacity. Used for milestones, success cards, value-moment reveals.
900ms · ease-out · replay 5s
Status
What the system is, not what it's doing. Static by design-system doctrine — colour alone carries the meaning.
06 — Day N of 14
Calibrating
Amber. Drafts only, no autonomous action. Resting; never animated.
#D97706 · static
07 — Focus
Exam mode
Green. Notifications muted, only critical signals surface.
#16A34A · static
08 — Off
Disabled
Muted gray. Distinguishable from loading. cursor: not-allowed in product use.
#A6A6A6 · static
Activity
Continuous loops while the system works. Each motion language maps to a distinct kind of work.
09 — Active
Thinking
Three faces brighten in sequence — right, bottom, left. The cube rotates attention through its three engines.
1800ms · 3-face rotation · loop
10 — Preparing
Drafting
Centre vertex pulses gently. The agent is preparing — work hasn't reached the edges yet.
1600ms · centre pulse · loop
11 — Flowing
Sync
Spokes brighten in sequence. Data flowing from the centre out along each front edge in turn.
1500ms · spoke chase · loop
12 — Ambient
3D yaw
Cube rotates slowly. Optional ambient idle on splash screens; never in product chrome.