Notes Typing

HTML to video · A whole scene · Apache-2.0

What it does

The notes-app confession as a mountable scene: a bold title, then body lines typed character by character on the measured human keystroke rhythm, the caret riding every landed character and jumping down at each paragraph. Credited to Miao Yang.

Get it

Copy it, or npx hyperframes add notes-typing, to compositions/components/notes-typing.html and mount it as a sub-composition; it brings its own timeline. 3 settings to change.

Source on GitHub
Needs

Loads its libraries from the network when it renders (cdn.jsdelivr.net).

Re-skin

By props (type, text)

Declared variables: title, lines, speed. Type come from theme custom properties with fallbacks (--font-body), so a :root block or one of the three themes re-skins it.

License

Apache-2.0

License notes are on the pack's page

From

HyperFrames

Everything from HyperFrames in the gallery

Back to the Asset Library