Interactive bento grid tiles expand + animate with various options.
Move the pointer over the grid. Each effect has its own switch in the controls underneath.
Track user behavior
Centralized data view
Work together seamlessly
Streamline workflows
Connect favorite tools
Enterprise-grade protection
| Prop | Type | Default | Description |
|---|---|---|---|
textAutoHide | boolean | true | Whether text content should auto-hide on hover. |
enableStars | boolean | true | Enable particle star animation effect. |
enableSpotlight | boolean | true | Enable spotlight cursor following effect. |
enableBorderGlow | boolean | true | Enable border glow effect that follows cursor. |
disableAnimations | boolean | false | Disable all animations (automatically enabled on mobile). |
spotlightRadius | number | 300 | Radius of the spotlight effect in pixels. |
particleCount | number | 12 | Number of particles in the star animation. |
enableTilt | boolean | false | Enable 3D tilt effect on card hover. |
glowColor | string | '132, 0, 255' | RGB color values for glow effects (without rgba wrapper). |
clickEffect | boolean | true | Enable ripple effect on card click. |
enableMagnetism | boolean | true | Enable subtle card attraction to cursor. |
Keyboard shortcuts and ARIA behavior.