Skip to content
Textlab
1
Browse

Scroll storytelling with text

Section titles that arrive as you scroll, and a paragraph that follows the reader.

Long pages read better when each section announces itself. Use one consistent title entrance and save the expressive effects for one or two key moments.

Section titles

tsx
<InViewTitle variant="lines" text="Everything your team needs to ship" />

Use the same variant for every section. In-view title shows titles that are already above the viewport immediately, so jumping to an anchor never leaves a heading hidden.

The key paragraph

tsx
<ScrollFill text="We believe the best interfaces disappear." />

Scroll fill ties brightness to scroll position, so it reverses when the reader scrolls back. Use it once per page.

A band between sections

tsx
<VelocityMarquee text="Available for new projects" />

Velocity marquee pauses on hover and focus, which keeps moving text compliant with WCAG 2.2.2.