Describble turns a sentence into a hand-drawn SVG avatar while you type: "tired pirate grandma, red beanie, round glasses" and the doodle redraws on every keystroke.

I wanted to see how far I could get with no framework and no AI, so here's how it's built:

- One static HTML page, vanilla JS, zero npm dependencies. The build is a single ~500-line Node script that concatenates the modules and inlines everything (121 KB gzipped, font included)

- Every keystroke replays the whole sentence through a rule-based parser, about 0.05 ms, so no debounce is needed

- The sketchy look: curves are split into tapered strokes, jittered with a seeded RNG, and "boil" between 4 frames at 9 fps (off with prefers-reduced-motion)

- The 2.5D head turn is just layer parallax: each SVG layer slides by its own depth

- Hash-based Content Security Policy: only the page's own inline script and style can run, and the only thing it can contact is an optional, documented counter of words it didn't understand

- English, Italian and Portuguese pages are prerendered at build time, and the gallery faces are rendered in Node through a tiny DOM stand-in, so search engines see real SVG files

It's rule-based, so it will miss words. Those misses are the most useful feedback I can get.

Site: https://describble.com

Code (MIT, drawings CC0): https://github.com/gasparegas/describble