913 B
913 B
| title | date | tags | description | icon | demo_url | source_url | draft | |||
|---|---|---|---|---|---|---|---|---|---|---|
| HTML/CSS Lavalamp | 2026-01-04 |
|
A pure CSS lavalamp animation with floating blobs | lavalamp | true |
A mesmerizing lavalamp effect created entirely with HTML and CSS. Features smooth floating animations and gradient blobs that rise and fall like a classic lava lamp.
Features
- Pure CSS animation (no JavaScript required)
- Customizable colors and blob shapes
- Smooth, organic floating motion
- Responsive design
How It Works
The animation uses CSS keyframes to create the illusion of blobs floating up and down. Multiple blob elements with different animation delays create a realistic lava lamp effect.
Usage
Simply copy the HTML and CSS into your project. You can customize the colors by changing the gradient values and adjust the animation speed by modifying the animation duration.