Transform your layouts with high-end, GPU-accelerated digital art. Prism Sphere is a lightweight, pure WebGL background component for Framer that renders a real 3D prism orb with realistic PBR glass materials. It dynamically shatters and recombines based on user scroll—with zero external libraries and zero performance lag.
🔥 KEY FEATURES:
1-Click Remix Ready: Copy the component straight into your project and go live in seconds.
Scroll-Reactive Magic: Watch the triangular prisms explode smoothly on scroll and seamlessly merge back. Works perfectly on static pages too!
Zero Dependencies: Raw WebGL code. No Three.js, no heavy iframes, no performance drops.
Smart Performance: Built-in IntersectionObserver automatically pauses the animation when off-screen to save user battery and CPU.
29 Custom Properties: Total control over 3D depth, studio lighting, rotation speeds, roughness, and custom two-tone gradients directly from the Framer sidebar.
🎭 PRESETS INCLUDED: Instantly switch between 4 Styles (Hologram, Blueprint, Aurora, Custom) and 6 Materials (Glass, Metal, Chrome, Crystal, Matte, Neon Wire).
💡 PERFECT FOR: Premium B2B SaaS landing pages, AI startup portfolios, tech dashboards, and futuristic dark-mode web designs.
Transform your layouts with high-end, GPU-accelerated digital art. Prism Sphere is a lightweight, pure WebGL background component for Framer that renders a real 3D prism orb with realistic PBR glass materials. It dynamically shatters and recombines based on user scroll—with zero external libraries and zero performance lag.
🔥 KEY FEATURES:
1-Click Remix Ready: Copy the component straight into your project and go live in seconds.
Scroll-Reactive Magic: Watch the triangular prisms explode smoothly on scroll and seamlessly merge back. Works perfectly on static pages too!
Zero Dependencies: Raw WebGL code. No Three.js, no heavy iframes, no performance drops.
Smart Performance: Built-in IntersectionObserver automatically pauses the animation when off-screen to save user battery and CPU.
29 Custom Properties: Total control over 3D depth, studio lighting, rotation speeds, roughness, and custom two-tone gradients directly from the Framer sidebar.
🎭 PRESETS INCLUDED: Instantly switch between 4 Styles (Hologram, Blueprint, Aurora, Custom) and 6 Materials (Glass, Metal, Chrome, Crystal, Matte, Neon Wire).
💡 PERFECT FOR: Premium B2B SaaS landing pages, AI startup portfolios, tech dashboards, and futuristic dark-mode web designs.
