A machine for making type move.

Every one of these is a few kilobytes of settings.

Nothing on this page is a video. Each loop is the engine itself, drawing a patch file in your browser. Open any of them in the machine and take it apart.

A darkroom for anything.

Drop in a photo or a video at any size. Stack risograph, halftone, photocopy, paper, grunge, film, chroma split, holographic foil, gradient maps and your own scanned textures, in any order, each with its own blend mode and opacity. Export at the source's full size, or reframe it for any format.

Every font, side by side.

Rows of your own words, each in its own font from 2,000+ open families, your Adobe Fonts project, your computer or your files. Size, weight, tracking and leading per row; stacks, grids and waterfalls; weight sweeps, tickers and typewriters. Vary deals you fonts you've never tried. Export a specimen sheet, or a loop.

See what your colours do to each other.

Lay your inks out as a printer's swatch card, as Albers' nested squares, as bands in proportion, as tints and shades, or set every one on every other and see which will read. Vary deals new palettes by harmony. Take the study away as an image or a loop, and the palette as CSS, JSON or an Adobe swatch file.

Type in, loop out.

1. Type and marks

   Write a word per line, or drop in an SVG logo. Choose from 2,000+ open fonts, your own Adobe Fonts kit or font files of your own.

2. Grid and motion

   Cells breathe in waves that travel down the rows and across the columns, so letters swell, squash and swap. Or cut the frame by the golden section, or fill the shape of a logo.

3. Keyframes and effects

   Animate any number or colour across the loop, as in After Effects. Add liquid, melt, halftone, photocopy, a moving gradient; fold it onto a cube, mirror it, or press it into a pin button.

4. Export

   Rendered offline, frame by frame, at any size: every social format, 2.39:1 title cards, A3 posters at 300 dpi. Every loop closes perfectly.

One patch, every format.

MP4

Social, decks, and editing in Premiere or After Effects.

H.264, encoded by your graphics hardware. Fast.

WebM

The web: small files, sharp edges.

VP9. Plays in every modern browser.

GIF

Slack, email, Figma prototypes.

Best at half size; grain makes GIFs heavy.

PNG

Posters, print, and stills for anything.

Any frame, up to A3 at 300 dpi, or double size.

Live embed

Your website: one tag runs the real engine.

Kilobytes, not megabytes, and sharp at any size.

Patch

The recipe, as a small .json file.

Same patch, same frames, every time. Share it as a link.

A motion system you can hand to a team.

• Lock a brand into presetsType, colour and marks saved as patches, so anyone can make loops that are on-brand by construction.
• Every size at onceThe same patch at 9:16, 4:5, 1:1, 16:9 and print. Change the format, keep the work.
• Logos that moveDrop in an SVG mark and it stretches like type, or the type fills its silhouette.
• Type over footageBring in a video, set the frame to 9:16, and put moving type over it, blended however you like.
• Website heroesEmbed the live engine instead of shipping a heavy video. It even rests when it's off screen.
• Title cards and posters2.39:1 scope frames for film titles; A4 and A3 at 300 dpi for print.
• Campaigns and merchPut a loop on a pin button for a mock-up, or set a slogan into a golden-section poster.
• Gradients on their ownLeave the words out and it's a gradient maker: mesh, linear or radial, looping, with grain.

Free, and yours to bend.

No build step and nothing to install: plain JavaScript modules and three small encoders. Run it on your own machine, put it on your own site, write your own effects and presets.

# run it locally (Node 22+)
git clone https://github.com/thisisnickdecker/create-o-matic
cd create-o-matic
npm run dev