Interactive Scramble

MAX

An interactive background animation with scrambling characters that react to mouse movement.

Demo

SCRAMBLE
Interactive Scramble
Exclusive Launch 50% offspots left: 0 / 50
3D Cube - happy face3D Cube - Happy Face
$39.99

$19.99

Payment once and get lifetime access
Access to all animations
All updates
All animations
No subscriptions

Usage Example

HELLO WORLD
Custom Scramble

Properties

The InteractiveScramble component accepts the following props:

PropertyTypeDefaultDescription
densitynumber50Density of characters (percentage of grid cells filled)
characterSetstringA-Z, a-z, 0-9, symbolsSet of characters to use for scrambling
scrambleDurationnumber1000Duration (ms) of the scramble animation per character
scrambleSpeednumber50Speed (ms) between scramble updates
interactionRadiusnumber100Radius (px) around the mouse that triggers scrambling
classNamestring""Additional CSS classes
staticTextstring""Optional static background text
textOpacitynumber0.1Opacity of the static background text
colorstring"cyan"Color of the scrambling characters (tailwind color class)