Public vault · every note in the open

Steal this vault

201 entries, 447 steal-notes — 281 by hand, 166 model drafts. 201 results have public source URLs. Source and classification review are recorded separately on each reference.

Find a design move. Shortlist the references. Export a brief with the notes and sources ready for your next project — no account needed.

Refine: kind, font, color, order

e.g. #e4572e

Jump to results

Variable weight and width fonts that physically stretch and compress to fit 100% of the screen width on resize. Read it as a style sheet →

Active filters:family: Kinetic Typography / Viewport Stretcher

4 references in Kinetic Typography / Viewport StretcherClear search & filters

DIA Studio — Kinetic Variable Type Identity System

Kinetic Typography / Viewport Stretcher · video / motion · via Awwwards

Source: pending · Classification: pending

Steal · typographyNotes by Will
Variable font axes (wdth 50..150, wght 200..900) are driven directly by scroll velocity and pointer X/Y coordinates so the headline stretches edge-to-edge (100vw) as a kinetic accordion.
Steal · motion/interactionNotes by Will
Phase-offset sine wave staggering (delay: calc(var(--line-index) * 45ms)) turns static multi-line stacked display type into a rhythmic mechanical cylinder.

Fonts: Whyte Inktrap, Monument Extended · Original: DIA Studio

private-reference-only

View original ↗

Source & usage rights

Original: DIA Studio. Source verification: pending review.

Recorded rights label: private-reference-only. Original work and reproduction rights belong to their owners. A note license does not grant rights to copy a screenshot, trademark or design.

Trova notes: apply the principles in your own work, including commercial projects. Bulk republication or resale is not permitted. Usage terms.

Captured: 2026-06-22. Capture does not establish source verification.

Studio Freight / Darkroom — Viewport-Locked Oversized Type

Kinetic Typography / Viewport Stretcher · full website · via Godly

Source: pending · Classification: pending

Steal · typographyNotes by Will
Display masthead uses font-size: clamp(4.5rem, 16.5vw, 22rem) with line-height: 0.84 and -0.04em tracking so the wordmark physically locks to both left and right viewport edges.
Steal · grid/layoutNotes by Will
Tiny 12px uppercase monospace index coordinates ([01 // ARCHITECTURE]) sit pinned at the exact mathematical intersections of the 12-column grid beneath the giant display type.

Fonts: Archivo, IBM Plex Mono · Original: Darkroom Engineering

private-reference-only

View original ↗

Source & usage rights

Original: Darkroom Engineering. Source verification: pending review.

Recorded rights label: private-reference-only. Original work and reproduction rights belong to their owners. A note license does not grant rights to copy a screenshot, trademark or design.

Trova notes: apply the principles in your own work, including commercial projects. Bulk republication or resale is not permitted. Usage terms.

Captured: 2026-06-22. Capture does not establish source verification.

Locomotive Montreal — Scroll-Driven Velocity Skew

Kinetic Typography / Viewport Stretcher · full website · via Awwwards

Source: pending · Classification: pending

Steal · motion/interactionNotes by Will
Project list rows apply a transient transform: skewX(calc(var(--scroll-velocity) * -0.18deg)) that snaps back to 0deg with a 280ms cubic-bezier ease the instant scrolling stops.
Steal · component patternNotes by Will
Hovering a full-width project row expands an inline video reel inside the word gap between the client name and the year (LOCOMOTIVE [REEL] 2026), pushing the text apart horizontally.

Fonts: Neue Haas Grotesk, Space Mono · Original: Locomotive

private-reference-only

View original ↗

Source & usage rights

Original: Locomotive. Source verification: pending review.

Recorded rights label: private-reference-only. Original work and reproduction rights belong to their owners. A note license does not grant rights to copy a screenshot, trademark or design.

Trova notes: apply the principles in your own work, including commercial projects. Bulk republication or resale is not permitted. Usage terms.

Captured: 2026-06-22. Capture does not establish source verification.

Apple Dynamic Island — Fluid SVG Path Interpolation

Kinetic Typography / Viewport Stretcher · video / motion · via Godly

Source: pending · Classification: pending

Steal · motion/interactionNotes by Will
Container morphs from a compact 126×36px pill to a 360×180px notification card using critically damped spring physics (stiffness: 320, damping: 26) with velocity handoff mid-gesture.
Steal · component patternNotes by Will
Live waveform bars and countdown timers stay continuously mounted during container expansion, scaling their layout bounds without unmounting or resetting animation frames.

Fonts: SF Pro Display, SF Mono · Original: Apple

private-reference-only

View original ↗

Source & usage rights

Original: Apple. Source verification: pending review.

Recorded rights label: private-reference-only. Original work and reproduction rights belong to their owners. A note license does not grant rights to copy a screenshot, trademark or design.

Trova notes: apply the principles in your own work, including commercial projects. Bulk republication or resale is not permitted. Usage terms.

Captured: 2026-06-22. Capture does not establish source verification.

Read the editorial record

Provenance & takedown

Publicly sourced references link to an original; private or concept examples are labelled separately. All referenced work belongs to its creators. What this vault adds — and what it is for — is the commentary: the steal-notes are the content, not the pixels. Notes are written by hand unless their card says otherwise; a model draft is always labelled. Study use only.

Made something shown here and want it removed? Email hello@trova.design with the entry title or a link to this page — it comes down promptly, no questions asked.

Try it in your agent · no key

One command puts these notes inside Claude Code. Without a key the agent sees 5 families and gets 5 calls a day — enough to judge the taste before you rent it. The key opens every family and lifts the meter.

claude mcp add --transport http trova https://trova.design/api/mcp