This is a submission for Frontend Challenge - Halloween Edition, CSS Art.
Inspiration
The idea came from imagining an old spooky mansion that seems to watch you as you move — inspired by classic Halloween tales and atmospheric pixel art games.
The goal was to make something that feels alive without heavy JS — just CSS magic and creativity.
Demo
👉 Live Demo :- https://codepen.io/Manukumar10/pen/KwVZROM
Journey
This project was a fun mix of creativity and problem-solving.
I built every layer — the house, moon, fog, clouds, and graveyard — using CSS gradients, clip-paths, and keyframes.
Features
CSS-only haunted house using clip-path & gradients
Glowing moon with layered shadows
Animated drifting clouds & flickering windows
Parallax motion on cursor move (tiny JS)
Accessible and responsive design
Tech Used
HTML, CSS (gradients, keyframes, clip-paths, blend modes),
JavaScript (light parallax interactivity)
Final Thoughts
This project was a fun mix of design and code — using CSS to build a living, breathing haunted house scene.
It reminded me how powerful simple web tools can be when mixed with creativity.
Happy Halloween, and good luck to everyone joining the challenge! 🎃
Top comments (0)