Typeset
Canvas ASCII renderer with amber-phosphor persistence: a headline (or a flowing noise field) redrawn as a weight-ramped glyph grid that pours in, shimmers, and brightens under the cursor.
canvaspro
Pro
The preview is live. The source is Pro.
One purchase, lifetime access: every pro component's source, CLI install with your own registry token, and all future drops.
Installation
CLI
npx shadcn@latest add @crucible/typesetProps
| Prop | Type | Default | Description |
|---|---|---|---|
| text | string | "TYPESET" | Headline rendered as the ASCII field (also emitted as sr-only text). |
| mode | "text" | "fluid" | "text" | "text" rasterizes the headline into the glyph grid; "fluid" renders a flowing turbulent-noise field as an ASCII brightness ramp. |
| charset | string | " .:-=+*#%@" | Character ramp ordered light → heavy; local density picks the glyph. The first character should be a space (empty cells). |
| cellSize | number | 12 | Grid cell size in px. Bigger = chunkier terminal art. |
| color | string | amber phosphor | Single signature hue. Bright cells bloom toward white. |
| speed | number | 1 | Animation-rate multiplier (shimmer, fluid churn, pour-in). |
| paused | boolean | false | Freeze the field at a fully formed static frame. |
| seed | number | 3 | Deterministic seed for shimmer phases and the noise field. |
Also accepts all props of Omit<React.ComponentPropsWithoutRef<"div">, "children" | "color"> — they pass through to the underlying element. | |||
Honors prefers-reduced-motion with a designed static fallback, pauses offscreen and on hidden tabs, and passes className through.