Uplift Your Website with Liquid Aluminum Shader
Add a premium, industrial aesthetic to your Framer website. Liquid Aluminum uses 3D surface normals to simulate studio light vectors bouncing off moving metal, bringing a heavy yet soft machined hardware feel directly to your website.
Whether you want a calm backdrop or a powerful, high-impact focal point, this component offers a highly immersive, visually tactile experience.
What it does
Aspect-Ratio Locked: Completely immune to stretching. Automatically normalizes coordinates so your aluminum waves keep perfect proportions, whether inside a small card or stretched wide across a 4K desktop banner.
Intelligent Throttling: Built specifically for full screen hero backgrounds. It dynamically throttles render bounds on ultra-dense mobile and retina screens to protect your page's scrolling performance.
Micro Refraction Fringing: Shifts subtle light channels along the edge of every metallic wave, adding a layer of optical depth and physical weight that standard flat color loops can’t replicate.
Zero Layout Friction: Built with alpha channel transparency and click-through disabled (pointer-events: none), allowing it to sit quietly beneath typography, buttons, and layout grids with zero interference.
Controls
Adjust the structural physics directly from the Framer sidebar:
Flow Speed: Controls the kinetic energy of the metal, shifting from an ultra-slow industrial crawl to a steady fluid ripple.
Wave Density: Adjusts the frequency of the shapes, alternating between wide, sweeping panels and tight, detailed metallic crests.
Contrast Power: Fine tunes the lighting contrast. Dial it up to sharpen the shadows, or pull it back to push the shader into a stunning light mode territory.
Perfect For:
High end tech, hardware, and AI landing pages.
Sleek dark mode portfolio websites.
Immersive product presentation sections and immersive hero headers.
Modern fashion, automotive, and luxury showcases.
Uplift Your Website with Liquid Aluminum Shader
Add a premium, industrial aesthetic to your Framer website. Liquid Aluminum uses 3D surface normals to simulate studio light vectors bouncing off moving metal, bringing a heavy yet soft machined hardware feel directly to your website.
Whether you want a calm backdrop or a powerful, high-impact focal point, this component offers a highly immersive, visually tactile experience.
What it does
Aspect-Ratio Locked: Completely immune to stretching. Automatically normalizes coordinates so your aluminum waves keep perfect proportions, whether inside a small card or stretched wide across a 4K desktop banner.
Intelligent Throttling: Built specifically for full screen hero backgrounds. It dynamically throttles render bounds on ultra-dense mobile and retina screens to protect your page's scrolling performance.
Micro Refraction Fringing: Shifts subtle light channels along the edge of every metallic wave, adding a layer of optical depth and physical weight that standard flat color loops can’t replicate.
Zero Layout Friction: Built with alpha channel transparency and click-through disabled (pointer-events: none), allowing it to sit quietly beneath typography, buttons, and layout grids with zero interference.
Controls
Adjust the structural physics directly from the Framer sidebar:
Flow Speed: Controls the kinetic energy of the metal, shifting from an ultra-slow industrial crawl to a steady fluid ripple.
Wave Density: Adjusts the frequency of the shapes, alternating between wide, sweeping panels and tight, detailed metallic crests.
Contrast Power: Fine tunes the lighting contrast. Dial it up to sharpen the shadows, or pull it back to push the shader into a stunning light mode territory.
Perfect For:
High end tech, hardware, and AI landing pages.
Sleek dark mode portfolio websites.
Immersive product presentation sections and immersive hero headers.
Modern fashion, automotive, and luxury showcases.
Sha
