@crazygl/hero-lava-lamp
v0.1.1
Published
Lava Lamp Blobs — Raymarched metaballs drifting through space and merging smoothly via SDF smin. Glossy + subsurface-style shading gives them a thick, viscous look. A customizable CrazyGL animated hero section — WebGL, React, drop-in.
Maintainers
Readme
Hero made by @ybouane.
@crazygl/hero-lava-lamp
Raymarched metaballs drifting through space and merging smoothly via SDF smin. Glossy + subsurface-style shading gives them a thick, viscous look.
Demo
Install
npm install @crazygl/hero-lava-lampUsage
import LavaLamp from '@crazygl/hero-lava-lamp';
export default function Page() {
return <LavaLamp blobColor="#ff5e92" smoothness={0.55} speed={0.6} />;
}Customise
- Blobs —
blobColor,blobAccent,blobInner(subsurface glow),smoothness(how eagerly they fuse),speed,glossy,innerStrength. - Background —
bgTopColor,bgBottomColor. - Layout —
centerX(slide the cluster left/right behind your copy).
Best for
- Creative studio and agency landing pages.
- Music and nightlife sites.
- Beauty / fragrance product pages and playful retro-luxe brand splash screens.
This hero is part of CrazyGL, a collection of production-ready WebGL, canvas, 3D, and typography effects. Every CrazyGL hero ships with an agent-ready SKILL.md file that helps developers and coding agents adapt the effect into custom landing pages and interactive experiences.
