A terminal-style grid of squares that flicker on and off
| Name | Type | Default | Description |
|---|---|---|---|
columns | number | 128 | Cells across the horizontal axis. |
rows | number | 128 | Cells across the vertical axis. |
color | string | "#ff7cf9" | Phosphor color in hex. |
backgroundColor | string | "#0a0a0a" | Screen fill color in hex. |
speed | number | 15 | Cells a row travels each second. |
rowBias | number | 0 | Push that biases rows toward one direction. |
fillThreshold | number | 0.3 | Cutoff above which a cell lights up, from 0 to 1. |
dashHead | number | 0.1 | Width of the lit edge of a cell, from 0 to 1. |
dashTail | number | 1 | Point at which a cell has faded out, from 0 to 1. |
rowFloor | number | 0.3 | Dimmest a row is allowed to be. |
alternateRows | boolean | true | Blank every other row. |
curvature | number | 1 | Amount of tube bend across the screen. |
glow | number | 0.25 | Bloom on the hottest cells. |
vignette | number | 0.5 | Darkening toward the screen corners. |
opacity | number | 1 | Master alpha from 0 to 1. |
cursorInteraction | boolean | true | Let the cursor disturb nearby rows. |
cursorRadius | number | 0.5 | Cursor influence radius in screen units. |
cursorIntensity | number | 1 | How far the cursor lifts nearby cells toward full brightness. |
paused | boolean | false | Freeze all motion. |
dpr | number | 1.5 | Maximum device pixel ratio. |
children | ReactNode | undefined | Content rendered above the field. |
width | number | string | "100%" | Container width. |
height | number | string | "100%" | Container height. |
className | string | "" | Additional CSS classes. |
columnsnumberCells across the horizontal axis.
128rowsnumberCells across the vertical axis.
128colorstringPhosphor color in hex.
"#ff7cf9"backgroundColorstringScreen fill color in hex.
"#0a0a0a"speednumberCells a row travels each second.
15rowBiasnumberPush that biases rows toward one direction.
0fillThresholdnumberCutoff above which a cell lights up, from 0 to 1.
0.3dashHeadnumberWidth of the lit edge of a cell, from 0 to 1.
0.1dashTailnumberPoint at which a cell has faded out, from 0 to 1.
1rowFloornumberDimmest a row is allowed to be.
0.3alternateRowsbooleanBlank every other row.
truecurvaturenumberAmount of tube bend across the screen.
1glownumberBloom on the hottest cells.
0.25vignettenumberDarkening toward the screen corners.
0.5opacitynumberMaster alpha from 0 to 1.
1cursorInteractionbooleanLet the cursor disturb nearby rows.
truecursorRadiusnumberCursor influence radius in screen units.
0.5cursorIntensitynumberHow far the cursor lifts nearby cells toward full brightness.
1pausedbooleanFreeze all motion.
falsedprnumberMaximum device pixel ratio.
1.5childrenReactNodeContent rendered above the field.
undefinedwidthnumber | stringContainer width.
"100%"heightnumber | stringContainer height.
"100%"classNamestringAdditional CSS classes.
""