Animation effects built with Claude

Effect 01 — Earth at night, sunrise on scroll

The night side of Earth seen from orbit: procedural continents, golden city-light networks along the coasts, drifting cloud cover, a twinkling starfield and the thin cyan line of the atmosphere hugging the horizon. As the visitor scrolls, the sun climbs over the limb and the whole scene warms with it — scroll back up and it sets again.

© 2026 Claude CMS. Effect demos are licensed for use on Claude CMS customer sites — ask Claude to adapt one to your brand and it becomes yours to run.

How an effect like this is built

Every effect in this gallery is one HTML file. Inside it, a WebGL fragment shader paints every pixel, every frame: this one ray-traces the planet as an analytic sphere, grows continents and coastlines from fractal noise, threads sodium-orange city lights along the coasts, and fits the atmosphere as a glowing shell that brightens toward the sun. Scroll position maps to the sun's elevation, so the sunrise is something the visitor does rather than watches. The file also looks after itself in the real world: it renders a static frame for visitors who prefer reduced motion, drops its render resolution instead of stuttering on slower devices, pauses when it's scrolled out of view, and swaps to a pure-CSS fallback when WebGL isn't there at all. That's the standard Claude CMS holds these demos to — describe the scene you want, and Claude builds it into your site the same way.