Not a 3D model.
Not a video.
Not a particle system.
Just a shader creating digital fabric in real time. 🧵✨
Customization
Everything is controlled directly from Framer's property panel.
Motion
Speed — Control the movement speed
Zoom — Adjust the scale of the fabric
Animate — Enable or disable continuous animation
Fabric
Tension — Control how tightly the surface bends
Folds — Adjust wrinkles and fabric deformation
Warp — Add organic procedural distortion
Lighting
Gloss — Control the intensity of glossy highlights
Intensity — Adjust the overall brightness
Interaction
Choose between:
None
Cursor
Ripple
Cursor + Ripple
You can also control:
Cursor Force
Ripple Radius
Ripple Strength
Colors
Start with one of the built-in palettes:
Aurora
Ocean
Violet
Ember
Cyber
Mono
Or select Custom and define your own:
Color A
Color B
Color C
Background
Performance
Choose between:
Low
Medium
High
The component also includes responsive rendering, device-pixel-ratio protection, viewport-aware rendering, resize handling, WebGL context recovery, and a static renderer fallback.

Not a 3D model.
Not a video.
Not a particle system.
Just a shader creating digital fabric in real time. 🧵✨
Customization
Everything is controlled directly from Framer's property panel.
Motion
Speed — Control the movement speed
Zoom — Adjust the scale of the fabric
Animate — Enable or disable continuous animation
Fabric
Tension — Control how tightly the surface bends
Folds — Adjust wrinkles and fabric deformation
Warp — Add organic procedural distortion
Lighting
Gloss — Control the intensity of glossy highlights
Intensity — Adjust the overall brightness
Interaction
Choose between:
None
Cursor
Ripple
Cursor + Ripple
You can also control:
Cursor Force
Ripple Radius
Ripple Strength
Colors
Start with one of the built-in palettes:
Aurora
Ocean
Violet
Ember
Cyber
Mono
Or select Custom and define your own:
Color A
Color B
Color C
Background
Performance
Choose between:
Low
Medium
High
The component also includes responsive rendering, device-pixel-ratio protection, viewport-aware rendering, resize handling, WebGL context recovery, and a static renderer fallback.
