Wave Text
Characters bob in a travelling wave, looping or once per hover, with stagger and amplitude controls.
Preview
Looping
Say hello, wave back.
Big amplitude, slow
weeeStill under reduced motion.
Install
Pro source requires Pebble Pro. Try the full preview above.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| text | string | — | The text that waves. |
| trigger | "loop" | "hover" | "hover" | Wave forever, or once per hover or focus of the text or its link. |
| amplitude | number | 0.25 | Peak lift in em. |
| stagger / duration | number | 0.045 / 0.7 | Seconds between letters, and per bob. |
| as | "span" | "h1" | "h2" | "h3" | "p" | "span" | Element to render. |
Pro component
Try the full preview above. Editable source and build guides require Pebble Pro.