Dithers — Audio-reactive art engine

Drop an image or video, or switch to Text below.

Source

Drop or click to upload PNG · JPG · WebP · MP4 · WebM

Or try a demo image

Source scale · shrink or grow100%

Extrude an SVG or type into a real 3D object that spins. The dither pipeline reads the rendered 3D frame, so all your shape / color / effect controls still apply.

Drop SVG to extrude into 3D Vector .svg — paths, polygons, shapes

Depth (extrusion)30

Bevel · roundness2.0

Material

Object colour

Follows Foreground

Use SVG fill colors

With SVG fill colors off, the mesh takes the Object colour above. Until you pick one it follows the Foreground from the Color panel.

Spin enabled

Spin X0.00

Spin Y0.40

Spin Z0.00

Camera distance300

Light intensity100

Engine: not loaded yet

A generative colour field. Works raw or dithered — all your shape / colour / effect / audio controls still apply.

Field

Blend with

Blend mode

Warp · flow amount50

Zoom · past the frame100

Palette

Lines · structure

Posterize · bands0

Contour lines

Kaleidoscope

Speed50

Quality · resolution

Presets

Adjust Sourcesource

Pre-process the source before dithering. Big lever for low-contrast inputs.

Contrast0

Brightness0

Saturation0

Hue rotate0°

Blur0px

Motionsource

Animate the source itself — images, video, webcam, screen and 3D. Recordings capture it, so any still photo becomes a loopable motion piece.

Motion · whole frame

Distort · warp the pixels

Speed50

Intensity50

Tiles · grid of copies1×1

Stagger tile timing · wave

Echo · trailing copies1

Echo delay · trail spacing25

Echo shrink · per copy100%

Echo rotate · per copy0°

Echo fade40

Backdropsource

Composite an image or video behind your work. It shows wherever your image leaves room: transparent PNGs and SVGs, Fit bars, or a scaled-down source.

Backdrop · image or video behind the text

Drop image / video

Fluid pattern on top · over the backdrop, under the text

Backdrop · behind the source

Drop image / video

Fluid pattern on top · drawn over the image

Gridmarks

Resolution60

Spacing0

Marks

Show source behind dots

Dither opacity100

Brightness drives shape size. Pick the shape.

Uploaded marks keep their own colours Mix multiple shapes

Sizemarks

Min size0%

Max size100%

Curve

Axis

Stretch X1.0×

Stretch Y1.0×

Invert brightness

Advanced (tone)

Sharpness (S-curve)0

Levels (posterize)Off

Colormarks

Background

#FFFFFF

Foreground

#0A0A0A

Duotone palettes — one click sets background + foreground.

Ink · how shapes get their color

Everything inks in the Foreground color above.

Rotationmarks

Manual0°

Snap to 90°

Auto-animate

Interval 90° steps

Speed1000ms

Effectsoutput

Post-processing applied on top of the dither output.

Distort · bend the picture

Distort amount0

Glow / bloom0

Chromatic aberration0

Scanlines0

Grain / noise0

Vignette0

Feedback trails0

Pixelate0

Glitch

Channel shift0

Shift angle0

Slice tear0

Slice density50

Pixel sort0

Sort threshold50

Glitch colors

Glitch speed · 0 holds still50

Audio Reactivity

Drop MP3 / WAV

0:00

No file

Custom mappings

Video sound · use video's own audio

Reactivity source

Motion · how the music moves the look

Motion intensity · tames or cranks every effect100

Mark swap · cells switch shape

Swap amount60

Mark warp · ripples the marks0

Colour cycle · inks drift through hues0

Size jitter · random big and small marks0

Giant marks · a few cells go huge0

Sparse · thin out into a scattered collage0

Let marks overlap · off gives each its own space

Response · how tightly visuals follow

Attack10ms

Release180ms

Audio overlay · drawn over the image

Sequencer

Capture looks as scenes, give each a duration and a transition, then preview or export the whole sequence as one video. Demo images, text, 3D and Fluid sources travel with scenes; uploads use whatever is currently loaded.

Copy from current look · choose what

Workflow: dial something in on the canvas first (e.g. pick a Motion in the Motion panel), then copy just that part onto every scene. The scene thumbnails update — the live canvas doesn't change.

Advance scenes

Beat modes cut scenes to the music. Load and play a track first.

No scenes yet — set up a look and capture it.

Export

Image

PNG resolution

Transparent background · PNG & SVG

Real vector paths — print, plotters, Illustrator. Post-effects (glow, grain…) are raster-only and stay out of the SVG.

Video

Live capture records what you see and hear, in real time. Frame-exact render draws every frame offline, never drops one, and carries the same slice of the track.

Records canvas at current size. Click Stop to save.

Fade in · seconds0s

Fade out · seconds0s

Fixed length · stop by itself

Format and quality

Recording format

Recording quality

30 fps capture · sharper frames per bit

MP4 opens everywhere (iPhone, QuickTime, editors). WebM (VP9) holds dither detail slightly better but won't play on Apple devices. Dither eats bitrate: High and Max keep the dots crisp; Max is about 6 MB per second.

GIF loop · short repeating clip

GIF duration3.0s

12 frames per second, rendered deterministically. With a track loaded the reactivity is baked in from the player's current position. GIFs carry no sound.

Steps every frame deterministically: no dropped frames, any resolution, slower than real-time. With a track loaded, audio reactivity is rendered in and the sound is included, starting from the player's current position. Video / camera / screen / GPU fluid fields still need live recording.

Send to apps