Text and numbers

Typewriter

Reveal a sentence with an absolute-time caret and readable cadence.

Live preview
Canvas scene1920 × 1080 preview8-second loop24 fps preview

Overview

Prompts, search queries, terminal moments, and conversational copy.

This is a working Mografy project rather than a visual placeholder. The loop above is exported directly from the component's Canvas scene, with the generated project thumbnail used as its poster frame.

Motion pattern

Characters appear from elapsed time while the caret remains deterministic at every seek position.

Timing

Absolute-time animation

Rendering

Deterministic Canvas

Editing

Scene parameters

Open the component

Run the component project from the Mografy repository root.

Terminal
mografy dev ./projects/.components/typewriter

The player opens the scene with its editable parameters, timeline, effects, audio controls, and export dialog.

Adapt the scene

  1. Open the component and scrub the complete eight-second loop.
  2. Keep the timing pattern that serves your story, then replace copy, colors, and layout in the scene module.
  3. Ask Claude or Codex to check the scene, review frames, and refine the result at the intended output size.
  4. Export MP4, WebM, Lottie, or SVGA from the same reviewed scene.

Keep the scene deterministic. Derive movement from the supplied time value and seeded helpers so preview, seeking, and export stay identical.

Project files

  • scenes/main.tsThe active scene entry used by the player.
  • scenes/typewriter.tsThe named component scene and its local drawing logic.
  • mografy.jsonProject configuration, fonts, parameters, rendering defaults, and review times.