Various ripple animations over text. A variety of options shown here in the same text block.
Picture a wave. In the ocean.
Picture a wave. In the ocean.
Picture a wave. In the ocean.
Telex project to try here.
Prompt
Create a WordPress text block that applies animated ripple effects to paragraphs and headings. Users type text normally, then select from six animation styles: Wave (characters bob up/down), Fade (sequential transparency), Scale (characters grow into place), Color (gradient waves), Blur (focus ripple), and Rotate (spinning into position).
Include trigger options: page load, scroll into view, hover, continuous loop, or click. Add ripple patterns: left-to-right, center outward, multiple origin points, or right-to-left. Provide speed, delay, intensity, and duration controls via sliders.
In the editor, show live animation preview with pause button. On frontend, text animates according to selected trigger and style. Automatically disable animations for users with reduced motion preferences. Include manual pause controls for accessibility.
Maintain all native WordPress text features: typography, colors, alignment, formatting, and responsive settings. Ensure text remains readable throughout animations and works with screen readers.
Use CSS transforms for performance. Support both classic and block themes. Default to wave ripple triggered on scroll with medium settings and full accessibility compliance.