Pretext Playground
Interactive text effects powered by pretext
Why Pretext-Powered Text Effects Are So Satisfying
The Pretext Playground transforms ordinary words into mesmerizing interactive art, inspired by pretext — Cheng Lou's groundbreaking pure-JavaScript text measurement and layout library. Pretext enables precise character-level positioning without DOM reflows, which means each letter can be independently tracked and animated with real-time physics. The result: fluid, responsive text effects that follow your cursor or touch, turning simple quotes into living typography.
Interactive pretext text animations tap into the same psychology that makes lava lamps, aquariums, and campfires so calming. The gentle motion of characters provides "soft fascination" — enough visual complexity to hold your attention while letting your mind rest. In Magnetic mode, characters scatter like a school of fish. In Explode mode, letters burst into colorful particles that drift under gravity before reassembling. In Vortex mode, characters spiral into hypnotic orbits around your cursor. The pretext library makes all of this possible by providing fast, accurate text measurement that works across Canvas, SVG, and WebGL.
Nine distinct modes make this pretext playground endlessly entertaining. Magnetic repulsion creates fluid fish-school dynamics. Explode mode shatters text into physics-driven particles. Flow mode lets you place stones and watch words river around them. Gravity mode tumbles characters into satisfying piles at the bottom of the screen. Vortex mode pulls letters into mesmerizing spiral orbits. Wave mode sends text undulating like water, amplified wherever your cursor passes. Scatter mode disperses characters like dandelion seeds when you hold, then gently draws them home when you release. Rainbow mode paints a flowing hsl gradient trail as you move. Jelly mode sends elastic ripple shockwaves from each tap, making characters bounce and deform like gelatin. Each mode runs at 60fps with spring constants, damping, and force fields creating natural-feeling motion — powered by the same pretext text measurement technology behind these incredible demos. Works on desktop and mobile, completely free.