Ultimate Fluid Sim is the gold standard for interactive backgrounds in Framer. It leverages advanced GPGPU (General-Purpose computing on Graphics Processing Units) techniques to simulate the complex movement of liquids and smoke in real-time. Every movement of the cursor generates "vorticity," creating organic swirls and eddies that react mathematically to the container's boundaries.

This component features an Elite Display Shader that goes beyond raw physics. It includes Velocity-Driven Chromatic Aberration, which prismatically splits the RGB channels of the fluid only where the flow is fastest, and a Hybrid Theme Engine that allows you to switch between Neon Additive (Dark Mode) and Ink Subtractive (Light Mode) visuals instantly.

✨ Key Highlights

• Real-Time Navier-Stokes Solver: A high-fidelity mathematical simulation of fluid flow. It handles advection, divergence, and pressure projection across multiple FBO (Frame Buffer Object) passes for buttery-smooth 60FPS motion.

• Kinetic Radius Technology: The "brush" size is alive. The simulation tracks cursor velocity; move slowly for thin, precise lines of dye, or swipe fast to create massive, sweeping waves of color.

• Velocity-Driven RGB Refraction: A premium optical effect where the fluid prismatically splits into Red, Green, and Blue channels based on the local velocity field. This creates a high-end "shimmer" effect that adds incredible depth.

• Dual-Mode Aesthetic Engine: * Dark Theme: Uses additive blending to create glowing, neon gases and celestial nebulae.

  • Light Theme: Uses subtractive blending to simulate ink-in-water or physical pigment mixing on a clean white canvas.

• Idle Automation (Idle Drops): Keeps the page alive even when the user isn't interacting. The "Auto-Splat" engine drops random "pigment" into the sim at customizable intervals, ensuring a constantly evolving visual state.

• Cinematic Post-Processing: Built-in Bloom Glow for highlights and a Dynamic Vignette that softly blends the fluid into your background color at the edges.

⚙️ Complete Design Control

• Physics Laboratory: Control the "Curl" (how many swirls appear), "Pressure" (the weight of the fluid), and "Dissipation" (how fast the dye and flow fade away).

• Performance Scaling: Choose between Low, Medium, or High Simulation Resolutions to ensure performance remains perfect on everything from mobile devices to ultra-wide displays.

• Optics & Colors: Configure a 4-color DNA palette. The simulation will cycle through these colors as the user interacts, creating a vibrant, multi-tonal masterpiece.

• Interaction Logic: Toggle between "Hover" interaction (sim reacts to simple mouse movement) or "Click & Drag" (sim only reacts when the user actively paints).