Shaders
MIT WebGPU effects as components — React, Vue, Svelte, Solid, plain JS
Graphics & 3D / Renderers · Freemium · 5.1k
Reviewed 2026-10-08 · last push 2026-10-09 · repo checked 2026-10-19
What's Good
Engine, 200+ components, and framework bindings are MIT (shader-effects-inc/shaders; npm `shaders` 4.0.2, 2026-10-07). One package with React, Vue, Svelte, Solid, and JS entries; TypeScript and SSR-safe. Agent-ready: `npx shaders skill` installs a skill, `npx shaders@latest install-mcp` wires an MCP server into Claude Code, Cursor, Codex and others, and shaders.com/llms.txt indexes the docs. Free visual design editor that exports the component tree. ★~2.7k.
The Catch
Real WebGPU, and the README does not describe a WebGL fallback — check your browser support targets before using it on critical UI. The design editor, CLI sync, and MCP need a shaders.com account, and the editor, presets, and sections are under separate platform terms, not MIT. The 1,000+ presets, ready-made sections, watermark-free renders, and the Framer plugin are paid Pro. Vs pixijs or babylonjs (full renderers you program): Shaders is drop-in effect components, not a scene graph or game engine.
Verdict
MIT WebGPU effect components when a landing page needs GPU polish without writing WGSL — free engine, paid preset library, no documented WebGL fallback.
Embed
Maintainer? Add the badge to your README. It is free, links to this review, and there is no paid version.
Markdown
[](https://stackgems.com/gems/shaders)
HTML
<a href="https://stackgems.com/gems/shaders"><img src="https://stackgems.com/badge/shaders.svg" alt="Shaders reviewed on Stack Gems" height="20"></a>