Start of resources section with placeholders

content/resources/lavalamp/index.md

@@ -0,0 +1,27 @@
+---
+title: "HTML/CSS Lavalamp"
+date: 2026-01-04
+tags: ["css", "html", "animation"]
+description: "A pure CSS lavalamp animation with floating blobs"
+icon: "lavalamp"
+demo_url: ""
+source_url: ""
+draft: false
+---
+
+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.