Weight Wave
HTML to video · A title · Apache-2.0
- What it does
A crest of thickness travels along a headline: each character swells from light to black and leans forward as the wave passes, driven by the wght and slnt variable-font axes rather than by transforms. Item license: OFL-1.1.
- Get it
Copy the folder into a project, or
npx hyperframes add weight-wave(fetches it from GitHub main to compositions/weight-wave.html). It is a whole page with its own timeline: render it alone, or mount it in a film as a sub-composition. 9 settings to change.- Needs
Loads its libraries from the network when it renders (cdn.jsdelivr.net).
- Re-skin
By props (colors, text)
Declared variables: text, color, background, weightFrom, weightTo, crestWidth, sweepSpeed, slant and 1 more. 3 hex colors and 2 font stacks are written in the file's CSS. It also reads its own custom properties with fallbacks (--background, --color); set them on a wrapping element to re-skin it…
- Size
1920 x 1080 · 6 s
- License
Apache-2.0
- From