dither
reedAn ordered Bayer dither over a layered value field. Crisp, print-like, tonal.
Six ways to read the same field.
Every pattern samples one seeded value field. Switch the lens, keep the seed.
glyph
sporeThe same field sampled into monospace glyphs. Reads like a quiet data console.
wave
brookSeven stacked wave layers, dark to light. Soft horizons over the pond.
pulse
dripA grid of dots that swell and brighten with the field. Halftone with a heartbeat.
maze
warrenSeeded diagonals in the 10 PRINT tradition. A labyrinth the field lights up.
bars
rainVertical bars rising with the field, cell by cell. A quiet equalizer.
A field with no edges.
A small collection of stable seeds. Hover any mark to bring it to life.
Tune one, take it with you.
Change the seed, pattern, palette and format, then export a circular avatar or a 1200×630 OG image.
format
shape
pattern
palette
animate
react to cursor
Frequently asked questions
Everything needed to use Ribbit as a deterministic avatar generator or a generative media engine.
Is Ribbit free to use?
Yes. Ribbit is open source under the MIT license and can be used in personal and commercial projects.
Does Ribbit make network requests?
No. Marks render locally in Canvas or SVG. There is no image API, upload pipeline or remote asset to fetch.
Can I generate images without a browser UI?
Yes. toSVG returns a standalone SVG on the server or in the browser. PNG and WebM helpers need browser Canvas APIs.
How does a seed become a stable avatar?
Ribbit hashes a string or number into a deterministic seed. The same seed, options and package version render the same mark every time.
Does Ribbit work with React and Svelte?
Yes. Ribbit ships compact avatar adapters for React 18+ and Svelte 5, plus a framework-agnostic Canvas engine.