What's New

Replaced hand-ported GeoPattern implementations with the official btmills/geopattern library for perfect visual fidelity, and eliminated the 15-second Figma plugin load time.

• 16 GeoPattern types now render with library-quality output — vibrant colors, proper density, and correct geometry
• Patterns fill any artboard size seamlessly via native SVG tiling with 3840×2160 viewport
• Default artboard changed to 1920×1080 for HD output
• Figma plugin loads instantly — thumbnails now generate lazily as cards scroll into view instead of all 447 at startup
• Figma pattern insertion uses PNG rasterization for guaranteed visual fidelity across all SVG features

A brand new dithering tool with 19 pixel-perfect algorithms, 30 procedural effects, 37+ curated palettes, and 12 retro hardware emulations.

• 19 dithering algorithms — Bayer (2/4/8/16), Blue Noise, Floyd-Steinberg, Atkinson, Stucki, Sierra, Jarvis, Burkes, halftone, crosshatch, stipple, and more
• 30 procedural shader effects — swirls, waves, matrix rain, voronoi, fractals, metaballs, and more categories
• 12 retro hardware palette emulations — Game Boy, PICO-8, C64, NES, CGA, Macintosh, ZX Spectrum, and more
• CPU-first architecture — true sequential error diffusion for pixel-perfect results via Web Workers
• OKLab color harmony palettes — analogous, complementary, triadic, split-comp, and monochromatic
• Zoomable viewport — scroll-wheel zoom, pan, fit-to-view, and artboard sizes up to 5K
• Export as PNG, SVG (vector shapes), animated GIF, or code (HTML/React/Vue/Svelte)

Comprehensive effects overhaul — 20 new sub-parameter controls, 4 new utility effects, and 9 bug fixes across the post-processing pipeline.

• 20 effect sub-parameter UIs — bloom threshold/radius, blur direction, glitch RGB shift, vortex center, kaleidoscope segments, and more
• 4 new effects — Vignette, Brightness/Contrast, Saturation, and Exposure with full GPU pipeline
• Wave frequency/speed, halftone dot size/angle, gradient map colors, and edge glow color now user-configurable
• Fixed dead uniforms — pixelate shape/smoothing, posterize dithering, VHS color bleed, vortex radius
• Fixed aspect-ratio distortion in vortex, kaleidoscope, ripple, and bulge effects
• Fixed edge glow luminance detection for accurate edge rendering

A brand new tool for generating animated SVG patterns for branding. 12 pattern types across 4 categories with simple controls, animation, and multi-format export.

• 12 pattern types — cymatics, waves, interference, grid, polka dots, concentric, topography, flow field, voronoi, spirograph, lissajous, moire
• 4 categories — wave, geometric, organic, and math patterns
• Fiber optic network pattern — glowing 2-pass neon lines with bright inner core
• CSS keyframe animations — drift, rotate, pulse, and draw effects
• Export as SVG, animated SVG, PNG, or CSS background-image code
• Visual pattern picker with live thumbnail previews
• Zoom controls on canvas with Ctrl/Cmd + scroll support
• 36 curated presets (3 per pattern type) for instant inspiration

Fluted glass effect rebuilt from scratch with 4 ridge shapes, real chromatic aberration, and 100 vibrant presets.

• 4 ridge shapes — sine, chevron, square, and sawtooth (Fourier series)
• 3 ridge patterns — straight lines, sinusoidal waves, and zigzag
• Real chromatic aberration with per-channel color separation
• Glass lighting — crest highlights, bright rim, trough shadows, specular
• Full export pipeline — React, HTML, Vue, Svelte code generation
• 100 new presets across 10 categories with vibrant color palettes
• Glass-ridge thumbnails on explore page (no more plain gradients)

Molten metal surfaces with specular highlights and chromatic aberration. Five built-in chrome presets.

• Iterative UV warping for realistic liquid metal distortion
• 5 chrome style presets — silver, gold, copper, neon, and custom
• Specular highlight sharpness and intensity controls
• Chromatic aberration for iridescent edge effects
• Animated flow speed for evolving liquid motion

Fiber-optic radiating lines with mouse-reactive force fields and vibrant gradient backgrounds.

• 4 field styles — fiber, starburst, convergence, fountain
• 4 background modes — mesh, linear, radial, and procedural gradients
• 50–600 lines with procedural noise displacement
• Mouse-reactive force field with repel/attract modes
• Origin glow, shimmer effects, and 3D perspective transforms
• Adaptive line/dot contrast — auto-switches to white on dark or dark on light

GPU-accelerated Navier-Stokes fluid dynamics with real-time dye advection and interactive splat injection.

• Full multi-pass GPU pipeline — splat, curl, vorticity, advection, pressure solve
• Auto-animation with wandering pointer for continuous motion
• Mouse interaction injects dye splats in real time
• Configurable simulation resolution (128–512) and dye resolution (512–2048)
• Vorticity confinement and dissipation controls for fine-tuned turbulence

Interstellar warp tunnel with nebular clusters, star fields, and chromatic shift effects.

• 4 warp styles — tunnel, vortex, hyperdrive, nebula
• Nebula cloud density and star brightness controls
• Tunnel radius, vortex strength, and streak length adjustments
• Chromatic shift for iridescent warp effects
• Center darkness and vignette for cinematic depth

Gravitational lensing with an accretion disk, Doppler shift, and photon ring — rendered in real-time 3D.

• Three-pass rendering — space scene, distortion, and final composite
• Accretion disc with rotational animation and customizable colors
• Orbiting particles and background star field
• Gravitational lensing distortion planes
• RGB chromatic aberration for relativistic effects
• Interactive camera — drag to orbit, scroll to zoom

Add vector shapes and text overlays on top of any gradient. Build rich compositions with multiple layers.

• SVG shape layers with customizable colors and opacity
• Text layers with full font control and blend modes
• 3D transforms — rotateX, rotateY, rotateZ on any layer
• Layer ordering, selection, and keyboard shortcuts (Delete/Backspace)
• Works with all 15+ gradient types

Claim a unique username and showcase your gradient portfolio on a public profile page.

• Unique username system with availability checking
• Public profile page at /u/username with gradient portfolio
• Display name, bio, avatar, and social link customization
• User statistics — gradients published, likes received, followers

Full social layer — follow creators, comment on gradients, and earn achievement badges.

• Follow/unfollow any creator with follower counts on profiles
• Threaded comments on community gradients with reply support
• 7 achievement badges — First Gradient, Popular Creator, Prolific, Remix Master, Color Scientist, Community Star, Early Adopter
• Badge strip displayed on user profiles

Share your personal invite code to give friends free Pro access and track your referrals.

• Personal invite code generated for every user
• Invitees get 2 days of free Pro access on signup
• Track redemption stats — who accepted and when
• Configurable max uses per invite code (default 10)

Make any collection public with a unique URL slug. Share curated gradient sets with the community.

• Toggle collection visibility between private and public
• Custom URL slugs for shareable collection pages
• Public collections browsable by anyone — no sign-in required
• Collection descriptions for context and curation notes

PBR metallic surfaces with Cook-Torrance BRDF, anisotropy, iridescence, and clearcoat rendering.

• Physically-based metallic materials
• Anisotropic reflections for brushed metal effects
• Iridescent color shifts based on viewing angle
• Clearcoat layer for glossy car-paint finishes

Ray-marched 3D SDF shapes with physically-based lighting and real-time rendering.

• Signed Distance Field shapes (spheres, tori, boxes, and more)
• Real-time PBR lighting with environment mapping
• Customizable materials and camera controls
• Smooth blending between SDF primitives

Audio-driven reactive gradient visualizations that respond to music and microphone input.

• Real-time FFT audio analysis
• Multiple visualization modes (waveform, spectrum, pulse)
• Microphone and audio file input support
• Beat detection for synchronized effects

Share your gradients with the community, browse and remix creations from other designers.

• Public gradient sharing with unique URLs
• Browse community gradients with tags and sorting
• User profiles with gradient portfolios
• Remix any shared gradient into your own creation

Organize saved gradients into named collections. Bookmark your favorites for quick access.

• Create unlimited named collections
• Bookmark gradients directly from the explore grid
• Share collections with a unique link
• Cloud sync across devices when signed in

Search gradients by name, color, mood, or style with fuzzy matching and intelligent suggestions.

• Fuzzy text search across gradient names and categories
• Recent and suggested search terms
• Combined text + color + type filtering
• Sort by name (A-Z / Z-A) or default order

Filter the explore grid by precise hue using a rainbow spectrum slider.

• Continuous hue spectrum slider (0°–360°)
• 15 preset color swatches for quick filtering
• Combines with text search and type filters
• Dominant color analysis for every preset

Three new 3D visualization modes: heightfield terrain, isometric block worlds, and terrain HUD displays.

• 3D Heightfield — gradient colors mapped onto a 3D terrain surface
• Isometric — voxel-style block world with customizable height and colors
• Terrain HUD — topographic contour maps with wireframe and scan-line overlays
• Full camera and lighting controls for each mode

Dramatic volumetric light beams and intricate fractal glass refraction patterns.

• Cinematic Beam — god-ray style volumetric light with adjustable intensity
• Fractal Glass — kaleidoscopic fractal patterns with glass refraction
• Both modes support full color customization
• Animated time parameter for evolving visuals

Space-themed cosmic nebula effect with swirling gas clouds, star fields, and deep-space atmospherics.

• Multi-layered noise-based nebula rendering
• Configurable star density and brightness
• Color palette control for nebula tones
• Smooth animated evolution over time

Print-style halftone dot patterns and retro ASCII art text-based rendering modes.

• Halftone — adjustable dot size, spacing, and angle
• ASCII — character density mapping with monospace rendering
• Both modes map gradient colors to pattern intensity
• Export halftone as SVG for print-ready output

Retro dithered gradient patterns with multiple dithering algorithms and pixel-art aesthetics.

• Ordered dithering (Bayer matrix 2×2, 4×4, 8×8)
• Floyd-Steinberg error diffusion option
• Adjustable color palette size (2 to 16 colors)
• Pixel scale control for chunky retro look

Northern lights aurora effect with flowing color ribbons and atmospheric glow.

• Layered noise-driven aurora curtains
• Configurable ribbon count and intensity
• Color palette from green to purple to pink
• Horizon glow and atmospheric perspective

Launch of the gradient explore page with over 1,000 curated presets across all gradient types.

• Masonry grid layout with responsive columns
• Deterministic card sizing for visual variety
• IndexedDB caching for instant revisits
• Viewport-priority rendering for fast first paint

Smooth multi-point gradient blending with organic color transitions.

• Multi-point color blending with smooth interpolation
• Configurable mesh density and distortion
• Up to 6 color stops with individual positioning
• Animated time evolution for flowing visuals

Perlin noise-based organic gradients with customizable frequency, amplitude, and octaves.

• Multi-octave Perlin noise generation
• Adjustable frequency, amplitude, and lacunarity
• Color ramp mapping with smooth blending
• Animated noise evolution over time

Radial gradient mode with lens flare and bokeh effects.

• Center-point radial gradients with falloff control
• Lens flare and bokeh overlay options
• Elliptical and circular shape modes
• Multi-stop color ramps

Real-time animated gradient preview on hover in the explore grid, powered by WebGL2.

• Dedicated WebGL2 renderer for hover previews
• Smooth animation with requestAnimationFrame loop
• DPR-aware rendering for Retina displays
• Zero-latency canvas attachment on hover

Export gradients as high-quality PNG, SVG, CSS code, or copy-paste React components.

• PNG export at custom resolutions (up to 4K)
• SVG export for vector-based workflows
• CSS gradient code with vendor prefixes
• React component snippet with inline styles