# oxyn

> Animated React loaders that say what your AI agent is doing: reading, editing, searching, calling a tool, uploading. Not just "loading".

oxyn is a set of 62 animated React loaders (56 single states and 6 group components), each drawn on a canvas and shipped as one self-contained file installed with the shadcn CLI. Instead of one spinner for every wait, each loader stands for one AI agent state: reading a file, editing, searching, calling a tool, uploading, waiting on approval.

- React only. Each file imports only from `react` and starts with "use client".
- Accessible: renders role="status" with a `label` prop, and holds still under prefers-reduced-motion.
- Each row also ships as one group component whose `animation` prop morphs between the row's states.
- MIT licensed. Not for determinate progress bars, skeletons, or Vue/Svelte/HTML.

Install any loader with `npx shadcn@latest add https://oxyn.space/r/<slug>.json`. The full registry index is at https://oxyn.space/r/registry.json. AI assistants can also query https://oxyn.space/mcp, an MCP server with search_loaders and get_loader tools.

## Group components

- [Dot Globe](https://oxyn.space/components/dot-globe): Switching between agent states with one component. Every dot-sphere animation in one component; the animation prop switches between them.
- [Dot Square](https://oxyn.space/components/dot-square): Switching between agent states with one component. Every square-sheet animation in one component; the animation prop switches between them.
- [Dot Circle](https://oxyn.space/components/dot-circle): Switching between agent states with one component. Every circle-sheet animation in one component; the animation prop switches between them.
- [Noise Rings](https://oxyn.space/components/noise-rings): Switching between agent states with one component. Every noise-ring animation in one component; the animation prop switches between them.
- [Arc Rings](https://oxyn.space/components/arc-rings): Switching between agent states with one component. Every arc-ring animation in one component; the animation prop switches between them.
- [Bar Ring](https://oxyn.space/components/bar-ring): Switching between agent states with one component. Every bar-ring animation in one component; the animation prop switches between them.

## Loaders

- [Dot Orb](https://oxyn.space/components/dot-orb): Thinking. A sphere of dots spinning on its vertical axis, with far-side dots shrinking and fading for depth.
- [Dot Cascade](https://oxyn.space/components/dot-cascade): Thinking. A still dot sphere where each row takes a full 360° turn in a staggered wave from top to bottom.
- [Dot Lift](https://oxyn.space/components/dot-lift): Processing. A still dot sphere where each ring pushes outward and settles back into place in a staggered wave from top to bottom.
- [Dot Tide](https://oxyn.space/components/dot-tide): Working on a task. A dot sphere where a narrow wave travels down, pulling a few rows of dots inward as it passes.
- [Dot Twist](https://oxyn.space/components/dot-twist): Reasoning through a problem. A dot sphere that scrambles and solves itself like a twisty cube, one row or column turn at a time.
- [Dot Scan](https://oxyn.space/components/dot-scan): Reading a file. A still dot sphere where a thin band of light reads down from top to bottom, for reading a file.
- [Dot Rise](https://oxyn.space/components/dot-rise): Uploading or downloading. A dot sphere where a wave pushes rows outward on its way up and fades them off the top, for uploading or downloading.
- [Dot Sweep](https://oxyn.space/components/dot-sweep): Searching. A still dot sphere where one lit column sweeps around the axis like a radar with a short fading trail, for searching.
- [Dot Compact](https://oxyn.space/components/dot-compact): Compacting or summarizing context. A dot sphere where two inward waves leave the poles and meet at the equator as a thin waist, for compacting context.
- [Dot Swarm](https://oxyn.space/components/dot-swarm): Parallel tool calls and subagents. A dot sphere where several narrow waves travel down at once, evenly spaced, for parallel tool calls and subagents.
- [Square Pulse](https://oxyn.space/components/square-pulse): Thinking. A flat square of dots where a ring of swollen dots spreads from the center to the edge.
- [Square Breath](https://oxyn.space/components/square-breath): Idle or waiting. A flat square of dots that grows and shrinks together, with optional center-to-edge ripple.
- [Square Wave](https://oxyn.space/components/square-wave): Processing. A flat square of dots that breathes in a sweep from left to right.
- [Square Fill](https://oxyn.space/components/square-fill): Loading. A flat square of dots that swells ring by ring until full, then shrinks back the same way.
- [Square Read](https://oxyn.space/components/square-read): Reading a file. A flat square of dots read row by row, like eyes moving across lines of text. For reading a file.
- [Square Edit](https://oxyn.space/components/square-edit): Editing a file. A flat square of dots where a few rows are typed in, like the changed lines of a diff. For editing a file.
- [Square Stream](https://oxyn.space/components/square-stream): Running a command, streaming output. A flat square of dots where output lines land row by row, the newest brightest, like a terminal. For running a command.
- [Square Plan](https://oxyn.space/components/square-plan): Working through a plan. A flat square of dots that ticks forward to a stop, blinks, then carries on or steps back, like a plan being worked and revised.
- [Circle Pulse](https://oxyn.space/components/circle-pulse): Thinking. A flat circle of dots where a ring of swollen dots spreads from the center to the edge.
- [Circle Breath](https://oxyn.space/components/circle-breath): Idle or waiting. A flat circle of dots that grows and shrinks together, with optional center-to-edge ripple.
- [Circle Wave](https://oxyn.space/components/circle-wave): Processing. A flat circle of dots that breathes in a sweep from left to right.
- [Circle Fill](https://oxyn.space/components/circle-fill): Loading. A flat circle of dots that swells ring by ring until full, then shrinks back the same way.
- [Circle Ping](https://oxyn.space/components/circle-ping): API call, tool call or MCP request. A flat circle of dots sending a ring out and getting a fainter echo back. For a tool call or request.
- [Circle Gather](https://oxyn.space/components/circle-gather): Uploading. A flat circle of dots where rings swell from the edge inward and the center pops, as if bundled and sent. For uploading.
- [Circle Await](https://oxyn.space/components/circle-await): Waiting on user approval. A flat circle of dots resting dim while the center beats slowly, like a heartbeat. For waiting on user approval.
- [Circle Radar](https://oxyn.space/components/circle-radar): Searching the web. A flat circle of dots swept by a turning wedge that leaves a fading trail, like radar. For searching the web.
- [Noise Drift](https://oxyn.space/components/noise-drift): Thinking. Thin concentric rings warped by smooth Perlin noise, rippling in soft curves.
- [Noise Ripple](https://oxyn.space/components/noise-ripple): Responding. Noise rings with a push travelling outward from the innermost ring, like a drop landing in water.
- [Noise Breathe](https://oxyn.space/components/noise-breathe): Idle or listening. Noise rings whose wobble swells, calms almost to circles, and swells again.
- [Noise Swirl](https://oxyn.space/components/noise-swirl): Thinking. Noise rings turning around the center, inner rings trailing behind so the shape twists.
- [Noise Converge](https://oxyn.space/components/noise-converge): Settling on an answer. Noise rings closing up into one bright line, holding, then fanning back out.
- [Noise Level](https://oxyn.space/components/noise-level): Voice or audio input. Noise rings whose wobble follows a level prop, for voice or audio input.
- [Noise Flow](https://oxyn.space/components/noise-flow): Uploading or downloading. Noise rings born calm at the center, flowing out to fade at the edge. For uploading or downloading.
- [Noise Stream](https://oxyn.space/components/noise-stream): Streaming an answer. Noise rings where each token sends a small push out from the center, at uneven gaps. For streaming an answer.
- [Noise Focus](https://oxyn.space/components/noise-focus): Deep reading or analysis. Noise rings pulling tight and bright around one ring, the lens moving slowly in and out. For deep reading or analysis.
- [Noise Scatter](https://oxyn.space/components/noise-scatter): Broad search. Noise rings whose wobble grows ring by ring from the center into tight ripples, then calms. For a broad search.
- [Arc Spin](https://oxyn.space/components/arc-spin): Loading. Concentric rings broken into arcs, turning steadily around the center.
- [Arc Chase](https://oxyn.space/components/arc-chase): Working on a task. Arcs whose heads run ahead and tails catch up, stretching and shrinking as they turn.
- [Arc Step](https://oxyn.space/components/arc-step): Step-by-step progress. Rings of arcs that each turn exactly one arc and hold, stepping inward like the dials of a lock.
- [Arc Gather](https://oxyn.space/components/arc-gather): Assembling a result. Rings of arcs whose cuts close into whole rings and reopen, one ring after another going inward.
- [Arc Ripple](https://oxyn.space/components/arc-ripple): Processing. Rings of arcs pulling inward and letting go, the pull travelling from the outer ring to the inner one.
- [Arc Gears](https://oxyn.space/components/arc-gears): Running a task. Rings of arcs turning at whole-number speed ratios, so their cuts line up on a regular beat.
- [Arc Comet](https://oxyn.space/components/arc-comet): Thinking. Rings of arcs turning steadily, each arc fading from a bright head to a faint tail.
- [Arc Unlock](https://oxyn.space/components/arc-unlock): Searching or matching. Rings of arcs clicking round like a lock trying combinations, then lining up. For searching or matching.
- [Arc Write](https://oxyn.space/components/arc-write): Writing or editing a file. Rings of arcs that draw themselves on and erase from the tail, one ring after another going inward. For writing or editing.
- [Arc Tasks](https://oxyn.space/components/arc-tasks): Parallel tool calls and subagents. Rings of arcs each turning at its own pace; finished rings close, dim and stop. For tool calls running in parallel.
- [Arc Progress](https://oxyn.space/components/arc-progress): Upload or download progress. Rings of arcs whose outer ring lights clockwise from 12 o'clock up to a progress. For an upload or download.
- [Bar Comet](https://oxyn.space/components/bar-comet): Thinking or running a tool. A fence of thin bars around a circle, with a bright head trailing a fading tail as it travels round.
- [Bar Twin](https://oxyn.space/components/bar-twin): Parallel tool calls and subagents. A fence of thin bars around a circle, with several evenly spaced waves moving them out or in as they travel round.
- [Bar Read](https://oxyn.space/components/bar-read): Reading a file. A fence of thin bars around a circle, with a small wave lighting them at a steady pace, like reading down lines.
- [Bar Write](https://oxyn.space/components/bar-write): Editing or writing a file. A fence of thin bars around a circle, typed in bursts until the ring is written, then wiped in order.
- [Bar Seek](https://oxyn.space/components/bar-seek): Searching (grep, web). A fence of thin bars around a circle, with a wave that runs ahead, backs up and runs on, like searching.
- [Bar Stream](https://oxyn.space/components/bar-stream): Running a command, streaming output. A fence of thin bars around a circle, with short pulses chasing round at uneven gaps, like tokens arriving.
- [Bar Transfer](https://oxyn.space/components/bar-transfer): Uploading or downloading. A fence of thin bars around a circle that fills to a progress, its leading bar pulsing, like an upload or download.
- [Bar Ping](https://oxyn.space/components/bar-ping): API call or MCP request. A fence of thin bars around a circle, with a pulse going out to 6 o'clock and back, like a request and its response.
- [Bar Plan](https://oxyn.space/components/bar-plan): Working through a plan. A fence of thin bars around a circle cut into steps: done steps hold, the current one sweeps, the rest wait.

## Optional

- [Full reference](https://oxyn.space/llms-full.txt): every component's install command, usage and props.