010
AC Creations Interactive Shader Footer
A drop-in footer component for AC Creations pages, with WebGL shaders that shift colors by time of day.
This reading didn't load. The transcript is below.
Read the transcript
I kept rewriting the same footer. Every AC Creations project needed one, and each time I built it from scratch. In August twenty twenty-five, I built one reusable component instead.
This is the AC Creations Interactive Shader Footer. Drop it into any web page and it works. The shader visuals respond to you. Colors shift with the time of day. It weighs under fifteen kilobytes, runs at sixty frames a second, and meets accessibility contrast standards. Plain HTML, CSS, and JavaScript, with WebGL shaders and a CSS fallback.
The footer is a brand touchpoint. A consistent piece keeps the identity cohesive. That matters to me. Explore the rest of the site, and follow along.
Narrated in my own cloned voice, generated with ElevenLabs v4.
I kept rewriting the same footer. Every AC Creations project needed one, with the same brand and the same visual tone, and I kept rebuilding it from scratch.
In August 2025, I built one reusable component instead. The Interactive Shader Footer is a self-contained block of HTML, CSS and JavaScript. Drop the folder into any page and it works.
The visual centre is a WebGL shader that responds to whoever is visiting. Colours shift with the time of day, so the footer looks different at noon than it does at midnight. If WebGL isn’t available, a CSS fallback takes over. The whole thing weighs under 15 KB, holds 60 fps, and meets WCAG AA contrast standards.
I built it with AI, vibe-coded and iterated fast, but every decision behind it came from a real problem. The closing section of a page is a brand touchpoint too. A footer that matches nothing is a missed step in the trail AC Creations leaves behind.
This one doesn’t miss. It’s launched.
The making
- HTML
- CSS
- JavaScript