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).
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! ❤️
I've been playing around with it and loving the available export options. Would love to see a WP plugin as well for a seamless integration.
the editor itself looks incredibly polished, especially how smooth the live preview updates while tweaking shaders in real time. honestly the export-to-any-framework approach is kind of brilliant, feels like they actually thought about how design engineers actually work day to day.
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.
Shaders was featured in Design Tools (261.3k followers), Developer Tools (515.9k followers) and Graphics & Design (4.3k followers) on Product Hunt. Together, these topics include over 117.2k products, making this a competitive space to launch in.
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.
Want to see how Shaders stacked up against nearby launches in real time? Check out the live launch dashboard for upvote speed charts, proximity comparisons, and more analytics.
Simon Le Marchant