Shaders v3 turns SVG logos into 3D compute effects
By Steven Van ·
Shaders' new v3 presets like Particles and Crystal animate a dropped-in logo without writing GLSL.
Shaders, the WebGPU component library behind some of the web's flashiest effects, shipped v3 with a party trick brand designers will feel immediately: drop in any SVG logo and transform it with compute-powered 3D effects, Particles, Crystal, and a set of other new presets. Your flat vector mark becomes a dissolving particle field or a refracting crystalline object, without writing a line of GLSL.
Compute-powered is the key phrase
The effects run on WebGPU compute, which is what makes logo-scale particle systems viable in a browser. A logo dissolved into particles means thousands of independently simulated points, exactly the workload compute shaders exist for and the old WebGL fragment-shader tricks faked poorly. Practically, it means these presets can be dense and physical while staying smooth on ordinary hardware, and they degrade from hero-section showpieces to subtle idle animation with a few parameter changes.
The logo is the right input
Making the SVG logo the drop-in input is smart product thinking. Every brand already has one, it's the single asset clients care most about seeing treated well, and animated brand marks are the highest-value, lowest-supply deliverable in web motion. A designer can now offer the "logo moment", the animated mark that opens a site or a reel, as a preset choice rather than a custom WebGPU engagement.
Shader tooling's big week
Logo effects are having a moment: Framer shipped mouse-interactive Liquid and Logo Gradient shaders the very next day (Shaders also maintains a 700+ preset Framer plugin, so the ecosystems overlap). The direction is consistent, GPU-grade polish migrating from custom code to droppable components, and the practical winners are the designers who adopt these while they still read as premium rather than default.
Try it
Shaders v3 with the new logo presets is available now at shaders.com, with React components and the Framer plugin as the fastest paths in. Feed it your own mark first, a logo you know well is the best judge of whether an effect flatters or fights it.
Sources: Shaders on X, Shaders.