Built with WebGL shaders for gpu-smooth performance and optimized specifically for Framer's ecosystem. Works flawlessly across all devices with intelligent scaling and responsive design.
Dynamic Color Transitions - Seamlessly blend between multiple border colors with smooth gradient animations
Customizable Glow Effects - Adjustable bloom and intensity controls for the perfect luminous effect
Floating Particle System - Add animated spots and smoke-like particles that dance along your borders
Real-time Animation - Smooth pulsing and flowing effects that bring static frames to life
Performance Optimized - Lightweight shader-based rendering ensures smooth animations without compromising speed
Responsive Scaling - Automatically adapts to any container size while maintaining visual quality
Border Customization - Fine-tune thickness, roundness, and softness for the perfect aesthetic
Animation Speed - Control the pace of color transitions and particle movement
Particle Density - Adjust the number and size of floating elements
Transform Controls - Precise positioning with scale, rotation, and offset options
World Size Settings - Manual override for advanced layouts and custom dimensions
Background Integration - Seamless background color blending for cohesive designs
Premium CTA call-to-action buttons that demand attention
Hero section frames that elevate your key messaging
Product showcase containers with luxury appeal
Interactive cards and panels that feel alive
Portfolio pieces that need that professional edge
Any design element that deserves to stand out from the crowd
No complex setup, no performance headaches β just drop it in and customize to match your brand. Whether you're building for startups or enterprise clients, this component delivers that premium feel that separates great design from good design.
--
Update 3rd November 2025: fixed looping glitch
----
Update 10th September 2025: fixed a glitch on Windows/Nvidia setup
--
Made possible thanks to paper.design and their shaders library.
Fred Moon
