Public vault · every note in the open

Steal this vault

201 entries, 447 steal-notes — 281 by hand, 166 model drafts. 33 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, order1 active

e.g. #e4572e

Jump to results

Pinned data visualizations responding directly to scroll progress, stepped annotations, and fluid map transitions. Read it as a style sheet →

Active filters:family: Scrollytelling / Interactive Infographic kind: editorial

3 references in Scrollytelling / Interactive Infographic · editorialClear search & filters

NYT Upshot — Sticky Canvas & Narrative Step Scrollytelling

Scrollytelling / Interactive Infographic · editorial · via SiteInspire

Source: pending · Classification: pending

Steal · grid/layoutNotes by Will
A position: sticky; top: 10vh visualization stage occupies 100% of the viewport while 420px translucent prose cards scroll past at 60vh intervals, triggering discrete chart state transitions.
Steal · component patternNotes by Will
Direct data labeling: instead of a detached color legend box, annotation callouts with 1px leader arrows point directly to the outlier data points discussed in the active paragraph.

Fonts: Georgia, Franklin Gothic Heavy · Original: The New York Times

private-reference-only

View original ↗

Source & usage rights

Original: The New York Times. 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-16. Capture does not establish source verification.

Distill.pub — Interactive Machine Learning Essay & Margin Scrubbers

Scrollytelling / Interactive Infographic · editorial · via Fonts In Use

Source: pending · Classification: pending

Steal · component patternNotes by Will
Inline hyperparameter scrubbers let the reader drag learning-rate or epoch sliders directly inside the mathematical figure, updating neural activation heatmaps in real time.
Steal · grid/layoutNotes by Will
CSS Grid academic layout ([screen-start] 1fr [page-start] 64ch [page-end] 240px [screen-end]) lets equations sit in the center measure while interactive figures break out to full page width.

Fonts: Charter, Inter · Original: Distill Editorial Collective

private-reference-only

View original ↗

Source & usage rights

Original: Distill Editorial Collective. 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-16. Capture does not establish source verification.

Bartosz Ciechanowski — Explorable Mechanical Watch & Gear Physics

Scrollytelling / Interactive Infographic · editorial · via Dead Simple Sites

Source: pending · Classification: pending

Steal · colorNotes by Will
Prose mentions of mechanical parts ('escapement wheel', 'pallet fork') are color-coded with inline pill backgrounds that match the exact RGB shader color of that gear in the 3D WebGL canvas below.
Steal · motion/interactionNotes by Will
Every WebGL figure starts paused or at calm low speed with a single explicit slider beneath it, never hijacking native page scroll.

Fonts: Charter, JetBrains Mono · Original: Bartosz Ciechanowski

private-reference-only

View original ↗

Source & usage rights

Original: Bartosz Ciechanowski. 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-16. 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