HueGrid.app - GPU-powered gradients that move, react, and export as code

by
The gradient studio designers actually want. 22+ GPU shader modes, from fluid sims (Navier-Stokes) to black holes (gravitational lensing) to liquid chrome (PBR). These aren't filters; they're real-time custom shaders. Export as code (CSS, Tailwind v4, React, Vue, Svelte, Swift) or media (PNG, MP4, GIF, up to 5K). Drop any photo for live gradient overlays. 1800+ presets to browse and customize. Free with 20 exports/month. Pro unlocks 5K, unlimited exports, and all code formats.

Add a comment

Replies

Best
Hunter
📌

📌 Hey Product Hunt!

I'm Taimoor, Product Designer and Founder at . I've been shipping products for startups for years, and every single project needed gradients, hero sections, backgrounds, and brand assets. I kept bouncing between 5-6 tools, and none gave me a real-time preview AND production code output.

So I built what I wished existed.

What makes HueGrid different:

🔬 Real GPU shaders:

Not filters on gradients. Each mode is a custom WebGL shader. Fluid sim uses Navier-Stokes. Black hole uses gravitational lensing. Liquid chrome uses PBR metallic rendering.

💻 Export to actual code:

CSS, Tailwind v4, React, Vue, Svelte, Swift. Not just images — real, production-ready code you copy-paste.

🖼️ Image input:

Drop a photo, get a live gradient overlay. Great for social media, hero images, and brand content.

🎯 1800+ presets across 22 modes:

Browse the gallery, pick one, customize it, export it. Takes seconds.

Free tier gets you 20 exports/month at 1080p. Pro unlocks everything.

Would love to hear what gradient modes I should build next? 👇