Effects that move.
30 GPU shaders you can drop in as layers. Press S, pick one, tune it.
The whole library.
Previews on this page are simplified, monochrome sketches. In the editor every effect runs on the GPU, in your colours.
Effects 20
- Mesh Gradient
- Static Mesh Gradient
- Static Radial Gradient
- Grain Gradient
- Dithering
- Dot Orbit
- Dot Grid
- Warp
- Spiral
- Swirl
- Waves
- Neuro Noise
- Perlin Noise
- Simplex Noise
- Voronoi
- Pulsing Border
- Metaballs
- Color Panels
- Smoke Ring
- God Rays
Image filters 7
- Paper Texture
- Fluted Glass
- Water
- Image Dithering
- Halftone Dots
- Halftone CMYK
- Lens Distortion
Logo effects 3
- Heatmap
- Liquid Metal
- Gem Smoke
A layer like any other.
Size, radius, opacity, borders and background are ordinary CSS. The inspector adds the shader's own controls.
- Presets and slidersStart from a preset, then tune every parameter.
- Colour lists and imagesPlus optional groups like grain, margins and folds.
- Play and pauseAnimated effects run live on the canvas.
Agents use them too.
Agents add shaders with <x-shader> in write_html and tune them with update_shader.
- Exports to React
get_jsxreturns@paper-design/shaders-reactcomponents with the same parameters. - Rendered in screenshotsExports and screenshots render shaders through headless Chrome.
Shaders are powered by Paper Shaders (Apache-2.0).
Press S and play.
Every effect is free and runs on your machine.