About this Component
The FractalGlass component is a high-performance React component that transforms standard images and videos into stunning, refracting glass masterpieces. Powered by a hybrid WebGL engine, it renders a cinematic distortion effect that combines fractal noise, volumetric height maps, and organic fluid motion, all optimized for a buttery-smooth 60FPS.
This component is deeply interactive and responsive. On desktop, it features a physics-based mouse parallax system that calculates depth in real-time; on mobile, it automatically switches to gyroscope control, allowing users to tilt their device to look "through" the glass. With advanced features like volumetric image masking (creating 3D glass logos), golden-angle cinematic blur, and a composite overlay system, FractalGlass is the ultimate tool for creating high-end, award-winning hero sections and visual assets.
Props include:
Content & Appearance
mediaType
image
video
imageScale
Physics & Flow
frequency
amplitude
speed
Pattern Customization
patternType
shardStyle
separation
pinch
Interaction (Parallax)
enableParallax
parallax
parallaxDirection
Warp & Curvature
enableWarp
warpType
bendAmount
bendCenterX
bendCenterY
Visual Effects
enableBlur
blur
enableAberration
aberration
Composite Overlays
enableOverlays
overlayImages
Inam 
