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.

What are you building?

New in the vault: 12 practical patterns with source notes and original diagrams.

Explore the additions

Refine: kind, font, color, order

e.g. #e4572e

Jump to results

193–201 of 201 references

Locomotive Studio — Horizontal Inertia Exhibition Rail & Vertical Index Counter

Horizontal Scroll / Studio Exhibition · full website · via Awwwards

Source: pending · Classification: pending

Steal · grid/layoutNotes by Will
Map vertical wheel delta onto a horizontal translate3d(-Xpx, 0, 0) gallery track divided by full-height 1px solid rgba(244,244,240,0.18) vertical spine pillars that hold rotated -90deg project numbers (01 / 08).
Steal · component patternNotes by Will
Pin a persistent bottom-right progress bar and keyboard arrow hint (← → TO NAVIGATE) so users always know their exact coordinate along the horizontal exhibition rail.

Fonts: Neue Montreal, IBM Plex 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-01. Capture does not establish source verification.

Studio Freight — Horizontal Project Ribbon, Scrubbable Marquee & Case Drawer

Horizontal Scroll / Studio Exhibition · full website · via Godly

Source: pending · Classification: pending

Steal · motion/interactionNotes by Will
Horizontal case-study cards skew subtly (skewX(-1.5deg)) proportional to scroll velocity and snap back to 0deg when scroll velocity settles.
Steal · typographyNotes by Will
Pair ultra-wide display project titles with a dense #00ff66 phosphor-green technical spec strip (CLIENT · STACK · YEAR · LIVE URL) pinned to the top border of each horizontal panel.

Fonts: Panchang, JetBrains Mono · Original: Studio Freight

private-reference-only

View original ↗

Source & usage rights

Original: Studio Freight. 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-01. Capture does not establish source verification.

Aristide Benoist — Sliced Horizontal Filmstrip Gallery & Keyframe Counter

Horizontal Scroll / Studio Exhibition · full website · via Awwwards

Source: pending · Classification: pending

Steal · component patternNotes by Will
Present the entire portfolio index as a centered horizontal filmstrip of 48px-wide vertical slices that expand smoothly to a 640px hero frame when clicked or centered under the viewport crosshair.
Steal · typographyNotes by Will
Keep project titles and index counters (014 / 032) fixed at the exact vertical and horizontal center of the viewport so only the underlying imagery glides past.

Fonts: Helvetica Neue, Courier New · Original: Aristide Benoist

private-reference-only

View original ↗

Source & usage rights

Original: Aristide Benoist. 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-01. Capture does not establish source verification.

Typotheque Foundry — Multi-Script OpenType Feature Tester & Long-Form Essay

Typotheque / Specimen Essay Pamphlet · editorial · via Fonts In Use

Source: pending · Classification: pending

Steal · component patternNotes by Will
Embed live OpenType feature toggles (smcp, onum, tnum, liga, ss01) directly beside historical typography essays so readers can test the exact typographic distinction being discussed in place.
Steal · grid/layoutNotes by Will
Use an asymmetric 3-column scholarly grid: left 20% for bibliographic footnotes and script coverage tags (Latin, Greek, Cyrillic, Devanagari, Arabic), center 55% for the 64ch essay, and right 25% for live glyph waterfalls.

Fonts: Fedra Serif, Fedra Sans, Fedra Mono · Original: Peter Biľak / Typotheque

private-reference-only

View original ↗

Source & usage rights

Original: Peter Biľak / Typotheque. 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-05-31. Capture does not establish source verification.

Klim Type Foundry — Kris Sowersby Design Information Essays & Glyph Waterfall

Typotheque / Specimen Essay Pamphlet · editorial · via Fonts In Use

Source: pending · Classification: pending

Steal · typographyNotes by Will
Pair long-form historical rationale essays set in Signifier (20px/1.65) with numbered margin figures that zoom into individual Bézier anchor points and ink-trap terminals.
Steal · component patternNotes by Will
Clicking any glyph in the 480-character specimen table opens a full-bleed vector contour overlay showing cap-height, x-height, baseline, and sidebearing metrics in Söhne Mono.

Fonts: Signifier, Söhne, Söhne Mono · Original: Kris Sowersby / Klim Type Foundry

private-reference-only

View original ↗

Source & usage rights

Original: Kris Sowersby / Klim Type Foundry. 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-05-31. Capture does not establish source verification.

Commercial Type Specimen — Variable Axis Scrubbers & Historical Specimen Notes

Typotheque / Specimen Essay Pamphlet · editorial · via Fonts In Use

Source: pending · Classification: pending

Steal · component patternNotes by Will
Stack optical size (opsz), weight (wght), and width (wdth) scrubbers in a compact sticky header bar that updates every specimen paragraph on the page simultaneously.
Steal · grid/layoutNotes by Will
Separate each optical size tier (Display, Deck, Text, Micro) with a 1px solid #111111 rule and an explicit point-size range badge (6pt–9pt Agate, 18pt–36pt Deck).

Fonts: Graphik, Publico, Austin · Original: Paul Barnes & Christian Schwartz

private-reference-only

View original ↗

Source & usage rights

Original: Paul Barnes & Christian Schwartz. 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-05-31. Capture does not establish source verification.

Monocle — 6-Column Global Dispatch Grid, Bureau Timezones & Gold Foil Badges

Monocle Magazine / High-Density Global · editorial · via Fonts In Use

Source: pending · Classification: pending

Steal · grid/layoutNotes by Will
Divide the 1440px masthead and front page into a dense 6-column newspaper grid separated by 1px solid #d6d1c4 vertical hairlines, packing 14 distinct dispatches above the fold without visual chaos.
Steal · component patternNotes by Will
Crown each dispatch with a circular #141413 number rondel (01..14) and a live bureau header bar showing local time and weather in London, Zurich, Tokyo, and Toronto.

Fonts: Plantin, Helvetica Neue, IBM Plex Mono · Original: Monocle / Tyler Brûlé

private-reference-only

View original ↗

Source & usage rights

Original: Monocle / Tyler Brûlé. 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-05-30. Capture does not establish source verification.

Financial Times — Salmon Newsprint Multi-Column Briefing & Sparkline Market Bar

Monocle Magazine / High-Density Global · editorial · via SiteInspire

Source: pending · Classification: pending

Steal · colorNotes by Will
Signature #fff1e5 warm bisque/salmon newsprint surface eliminates stark #ffffff glare across dense 5-column financial tables while #990f3d claret and #0d7680 teal provide unmistakable semantic accents.
Steal · typographyNotes by Will
High-contrast wedged serif headlines (Financier Display) sit over compact Metric sans deck summaries and inline 1-day SVG equity sparklines.

Fonts: Financier Display, Metric, IBM Plex Mono · Original: Financial Times Design

private-reference-only

View original ↗

Source & usage rights

Original: Financial Times Design. 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-05-30. Capture does not establish source verification.

Bloomberg Businessweek — High-Density Editorial Ticker & Swiss Grotesk Tables

Monocle Magazine / High-Density Global · editorial · via Fonts In Use

Source: pending · Classification: pending

Steal · typographyNotes by Will
Set feature headlines in tightly tracked Neue Haas Grotesk Bold (letter-spacing: -0.03em) flush-left against heavy 4px solid #000000 top section rules and #2800d7 ultramarine data callouts.
Steal · grid/layoutNotes by Will
Interleave 2-column narrative journalism with inline tabular-nums financial comparison matrices that span 3 columns without breaking the vertical baseline rhythm.

Fonts: Neue Haas Grotesk, BWHaasText, IBM Plex Mono · Original: Bloomberg Businessweek

private-reference-only

View original ↗

Source & usage rights

Original: Bloomberg Businessweek. 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-05-30. 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