# Shaders v3 turns SVG logos into 3D compute effects

By Steven Van · 2026-07-15

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.

[Source post](https://x.com/i/status/2077441745420210287)

## 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](<https://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.

![Shaders](<https://www.google.com/s2/favicons?domain=shaders.com&sz=128>)

Shaders

Component library for creative WebGPU effects — 100+ ready-to-use shaders for React and the web.

[View Shaders →](<https://creatorstoolbox.com/resources/shaders>)

Sources

[Shaders on X](<https://x.com/npm_i_shaders/status/2077441745420210287>), [Shaders](<https://shaders.com/>).

[Read Shaders v3 turns SVG logos into 3D compute effects on Creators Toolbox](<https://creatorstoolbox.com/blog/shaders-v3-3d-logo-effects>)

---
Canonical source: https://creatorstoolbox.com/blog/shaders-v3-3d-logo-effects