Ascii Field
Живое поле из ASCII-символов: плывущий шум выбирает каждый знак, курсор выпячивает поле линзой и подсвечивает его, а от клика символы сбегают вниз, как цифровой дождь в «Матрице».
зависимости 0файлы tsx + tsпараметры 8react 18+
X 0000 Y 0000↳ Поводите курсором, кликните или коснитесь — пойдёт дождь
Пульт08 параметров
01charset
Символы от пустого к плотному.
02cellSize
px
Ячейка одного символа.
03color
Цвет символов.
04accent
Цвет под курсором и в потоках.
05speed
Скорость течения.
06scale
Размер узоров.
07radius
px
Радиус линзы курсора.
08rain
Клик запускает цифровой дождь.
01 Пропсы
| Проп | Тип | По умолчанию | Описание |
|---|---|---|---|
charset | string | " .·:-=+*%#@" | Символы от пустого к плотному. |
cellSize | number | 14 | Ячейка одного символа. |
color | string | "#3d4a2a" | Цвет символов. |
accent | string | "#b6e24c" | Цвет под курсором и в потоках. |
speed | number | 1 | Скорость течения. |
scale | number | 1 | Размер узоров. |
radius | number | 170 | Радиус линзы курсора. |
rain | boolean | true | Клик запускает цифровой дождь. |
className | string | — | Передаётся корневому элементу. |
style | CSSProperties | — | Передаётся корневому элементу. |