This product was not featured by Product Hunt yet. It will not be visible on their landing page and won't be ranked (cannot win product of the day regardless of upvotes).
Product upvotes vs the next 3
Waiting for data. Loading
Product comments vs the next 3
Waiting for data. Loading
Product upvote speed vs the next 3
Waiting for data. Loading
Product upvotes and comments
Waiting for data. Loading
Product vs the next 3
Loading
Shaders
The design platform for web shaders
Shaders is the design platform for web shaders. Create stunning WebGPU-powered effects with a pro-grade visual editor, then export clean component code for Vue, React, Svelte, Solid, JavaScript, and Framer. Trusted by 10,000+ design engineers to ship beautiful, production-ready frontend experiences.
Hey Product Hunt 👋
I'm Simon, the founder of @Shaders. I was previously at Clerk, and 15+ years of freelance before that.
I started Shaders because there was a huge gap between modern frontend development and shader programming. On one side you have reusable components, props, and composition. On the other, GLSL, WGSL, and graphics math; I'm not a fan of trigonometry. Shaders was built to bridge that gap make creative effects easy for design engineers.
What began about 18 months ago as a small prototype built on Three.js TSL has grown into a complete design platform. We opened the public beta in February, and we've been shipping improvements every week since.
Here's how it works:
1. Design a shader by mixing and matching from 160+ shader components. You can mask, blend, and customize countless props. Bring in your own media or generate 3D effects from your SVG logo.
2. Once you're happy, install the Shaders MCP and ask your agent to install the shader in your project. All code is production-ready, using components delivered via our npm package; it's as simple as that.
3. Go grab a drink or something, you're done. There's no need for a third step.
Today's launch is our biggest release yet. We've introduced a completely redesigned visual editor, built an all-new rendering engine powered by TypeGPU that's dramatically faster and lighter, expanded the component library, and made it easier than ever to go from idea to production-ready code in minutes.
More than 10,000 design engineers use Shaders to build interactive websites and ship GPU-powered experiences. Try it out yourself for free at https://shaders.com
I'd love to hear your thoughts, answer any questions, or get feedback on where we should take Shaders next. Thanks so much for checking it out! ❤️
About Shaders on Product Hunt
“The design platform for web shaders”
Shaders was submitted on Product Hunt and earned 24 upvotes and 6 comments, placing #27 on the daily leaderboard. Shaders is the design platform for web shaders. Create stunning WebGPU-powered effects with a pro-grade visual editor, then export clean component code for Vue, React, Svelte, Solid, JavaScript, and Framer. Trusted by 10,000+ design engineers to ship beautiful, production-ready frontend experiences.
On the analytics side, Shaders competes within Design Tools, Developer Tools and Graphics & Design — topics that collectively have 781.5k followers on Product Hunt. The dashboard above tracks how Shaders performed against the three products that launched closest to it on the same day.
Who hunted Shaders?
Shaders was hunted by Simon Le Marchant. A “hunter” on Product Hunt is the community member who submits a product to the platform — uploading the images, the link, and tagging the makers behind it. Hunters typically write the first comment explaining why a product is worth attention, and their followers are notified the moment they post. Around 79% of featured launches on Product Hunt are self-hunted by their makers, but a well-known hunter still acts as a signal of quality to the rest of the community. See the full all-time top hunters leaderboard to discover who is shaping the Product Hunt ecosystem.
For a complete overview of Shaders including community comment highlights and product details, visit the product overview.
Simon Le Marchant