Flowing Text

A typesetting experiment where a full-screen essay reflows around drifting objects in real time: per-character line breaking, draggable obstacles, and column controls.

Try Websites Agent

Loading preview...

Start with this prompt

A typesetting experiment where a full-screen essay reflows around drifting objects in real time: per-character line breaking, draggable obstacles, and column controls.

Try Websites Agent

Build an experimental page about live text wrapping. Fill the screen with a short essay about typesetting, set in a serif typeface with generous whitespace so it stays pleasant to read. Scatter a few small objects across the page and let them drift and collide on their own; the text must wrap around each object in real time, measured character by character, so the lines of the essay keep re-breaking smoothly as the obstacles move through the layout. The objects are not just decorative: the visitor can grab any of them with the mouse, drag it across the page, and throw it, watching the text give way and close in behind it. Provide controls to switch the composition between two and three columns, to pause and resume the motion, to reset the scene, and to zoom the whole page with the scroll wheel. Every control should feel like part of the essay rather than a separate panel, and the reading experience should stay fluid no matter how chaotic the objects become. Single-file static page.

Add Object Editing

Adds a small editing feature: double-click any floating object to change its text or replace it with a new one, and the essay reflows around the edited object in real time.

Try Websites Agent

Build an experimental page about live text wrapping. Fill the screen with a short essay about typesetting, set in a serif typeface with generous whitespace so it stays pleasant to read. Scatter a few small objects across the page and let them drift and collide on their own; the text must wrap around each object in real time, measured character by character, so the lines of the essay keep re-breaking smoothly as the obstacles move through the layout. The objects are not just decorative: the visitor can grab any of them with the mouse, drag it across the page, and throw it, watching the text give way and close in behind it. Provide controls to switch the composition between two and three columns, to pause and resume the motion, to reset the scene, and to zoom the whole page with the scroll wheel. Every control should feel like part of the essay rather than a separate panel, and the reading experience should stay fluid no matter how chaotic the objects become. Single-file static page.

Switch to Dark Canvas

Moves the experiment onto a dark background while keeping the serif type and generous whitespace, so the moving objects and the reflowing text stand out in stronger contrast.

Try Websites Agent

Build an experimental page about live text wrapping. Fill the screen with a short essay about typesetting, set in a serif typeface with generous whitespace so it stays pleasant to read. Scatter a few small objects across the page and let them drift and collide on their own; the text must wrap around each object in real time, measured character by character, so the lines of the essay keep re-breaking smoothly as the obstacles move through the layout. The objects are not just decorative: the visitor can grab any of them with the mouse, drag it across the page, and throw it, watching the text give way and close in behind it. Provide controls to switch the composition between two and three columns, to pause and resume the motion, to reset the scene, and to zoom the whole page with the scroll wheel. Every control should feel like part of the essay rather than a separate panel, and the reading experience should stay fluid no matter how chaotic the objects become. Single-file static page.

Try Sans-Serif Setting

Restyles the essay in a high-contrast sans-serif face instead of the serif, showing how the same live wrapping and line re-breaking feels with a different typographic voice.

Try Websites Agent

Build an experimental page about live text wrapping. Fill the screen with a short essay about typesetting, set in a serif typeface with generous whitespace so it stays pleasant to read. Scatter a few small objects across the page and let them drift and collide on their own; the text must wrap around each object in real time, measured character by character, so the lines of the essay keep re-breaking smoothly as the obstacles move through the layout. The objects are not just decorative: the visitor can grab any of them with the mouse, drag it across the page, and throw it, watching the text give way and close in behind it. Provide controls to switch the composition between two and three columns, to pause and resume the motion, to reset the scene, and to zoom the whole page with the scroll wheel. Every control should feel like part of the essay rather than a separate panel, and the reading experience should stay fluid no matter how chaotic the objects become. Single-file static page.