Lazy-uiLazy UI
Star0

Liquid Reveal

A WebGL fluid sim — cursor leaves a dye trail that uncovers a second image through the first, with idle auto-drift.

Customize

Cursor size200px
Mouse force60
Resolution0.50x
Viscosity42
Reveal strength1.00
Reveal softness0.85
Auto speed0.50
Auto demo

Usage

import { LiquidReveal } from "@/components/lazy-ui/liquid-reveal";

export function Demo() {
  return (
    <div className="relative h-[480px] w-full overflow-hidden rounded-xl">
      <LiquidReveal
        frontImage="/images/armor.png"
        backImage="/images/human.png"
      />
    </div>
  );
}