Particle Grid renders a 3D cube-like particle field that rotates continuously along multiple axes while maintaining depth perspective. Each particle’s position and scale are projected in real time to create a visually immersive 3D effect.
The component reacts to mouse movement, subtly adjusting the rotation and perspective to give the illusion of interactivity. Particle size, spacing, count, and zoom level are fully adjustable, and color settings allow for easy theme integration. The animation speed and mouse influence can be fine-tuned for smooth and responsive motion.
Particle Grid is lightweight, optimized for performance, and serves as an ideal animated background for landing pages, hero sections, dashboards, or experimental interfaces.
Key Features3D particle cube layoutMouse-responsive rotation and perspectiveAdjustable particle size, spacing, and countCustomizable colors and backgroundAnimation speed and zoom controlLightweight and performantSupports interactive and immersive UI experiences
Use CasesHero section backgroundsLanding page animationsDashboard and data visualization backdropsFuturistic or tech-focused designsInteractive web interfaces and portfolios
Best Practices / TipsUse moderate particle counts for performance on large screensPair with subtle background colors to emphasize depthAdjust mouse influence for more subtle or exaggerated interactivityCombine with other motion backgrounds for layered effectsSet zoom level carefully to balance immersion and clarity
What’s IncludedOne Particle Grid componentFull 3D particle rotation with perspective projectionMouse interaction and influence controlCustomizable particle size, spacing, and countColor and background customization
Who It’s ForFramer designers and developers seeking interactive backgroundsUI/UX designers exploring 3D motion effectsNo-code builders creating futuristic interfacesDesigners building tech-focused landing pages or dashboards
Plaiter
