Animation effects built with Claude

One planet, one fire, four logos, one builder

Each preview below is a short loop of the real effect — open a card and it runs live in your browser. Every effect is a page Claude built end to end, and the logo effects work from an SVG, so Claude can rebuild them around your own logo and colours.

© 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 effects like these are built

Every effect in this gallery is one page you can read from top to bottom. In the Earth scene, a single WebGL fragment shader paints every pixel, every frame: it 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. It 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. The logo effects start from the logo’s SVG and rebuild it — as glass tubes and layered glow for the neon sign, as twenty thousand points for the morph, and as an extruded 3D shape for the emboss, the last two drawn with three.js. Describe the effect you want, and Claude builds it into your site the same way.