Primitive · CLI
ASCII Donut
The spinning torus — 3D points depth-buffered per character cell and shaded by surface normal through a luminance ramp (.,-~:;=!*#$@).
Preview
npx shadcn@latest add @atroui/ascii-donutInstallation
Agent blurb — install command + no npm UI rule. For agents
npx shadcn@latest add @atroui/ascii-donutSource lands in your repo. Installation · Registry
Usage
One hero-moment scene. Keep cols ≤ 110 — the frame is pure canvas work and small cells are happier than big ones. Pass chars='newskool' for the scene-style ramp.
tsx
import { AsciiDonut } from "@/components/ui/ascii-donut"
<AsciiDonut cols={80} speed={1.2} />API reference
| Prop | Type | Default | Description |
|---|---|---|---|
| cols | number | 64 | Columns in character cells; rows derive from the 1:2 cell ratio. |
| speed | number | 1 | Spin multiplier. |
| chars | string | .,-~:;=!*#$@ | Luminance ramp (dim → bright), or a rig ramp name. |
| label | string | "Rotating ASCII torus" | Accessible description; canvas is aria-hidden. |
| className | string | — | Regular className. |
Donut