Design Vault

Design from what you liked.

Like a post on X and Design Vault keeps the image with your note. When your coding agent builds a page, it opens the references you saved and works from the pictures themselves.

Install the skill Try a brief

Seen first. Then written.

  1. You like it.

    A heart on X opens Design Shelf. You write one line on why the post is worth keeping.

  2. Your agent studies it once.

    With the original open, your own agent records proportions, the device worth taking, how to rebuild it, and colors measured from the pixels.

  3. Every agent after can use it.

    Your agent reopens the originals whenever you invoke the skill. Agents without your library get the written description from the shared vault, and the images stay in your folder or your own bucket.

LandingsReviewed508:0
Summary
Pale pointed vaults repeat down a nave toward a bright end wall; every rib converges on one point.
Layout
One-point perspective. Vanishing point at 50% width, 42% height. Ribs fill the top two thirds; the floor is a quiet band.
Signature
Repetition that speeds up toward the light, so the eye lands where the action should be.
Recipe
Hero on a centre axis. Repeat one shape at shrinking scale toward a single focal button. Keep text out of the converging lines.
Colors
#ddd3d7#b0a7a6#988173#77553d
Uncertainty
A still photograph. Says nothing about motion or how this would respond on a phone.
Church interior with pale pointed vaults converging toward a bright wall
0% developed into words

From a heart to a handoff

  1. Like

    Liking a post with images opens Design Shelf right over X. Skip it and the like stays a like.

    image-01.png · image-02.png · reference.json
  2. Note

    One line on what is worth keeping, a folder and a few tags. Files land where you choose, and in your own R2 bucket if you connect one.

    landings/2026-10-10_2105644004931170616/
  3. Describe

    Your agent studies a few originals and writes down layout, signature, a rebuild recipe and colors sampled from the file.

    vault.py colors → #0847aa 22% · #f3f3eb 16%
  4. Design

    For each page it asks for three to five references, writes a short direction, builds it, and checks the render at three widths.

    remote.py --components hero cards footer

Ask the vault.

A real request to the shared vault, from your browser. This is the written half: the descriptions an agent gets without your library.

Up to five references land here as cards: what the picture shows, its palette, and what a still image cannot tell your agent.

One command.

Pick your agent, copy, and paste it in a terminal. Needs Node 22+ and Python 3.10+.

See the commands

Before you install

Do I need the extension?

No. The skill installs with access to a shared set of reviewed descriptions. The extension is for building a library of your own.

Does it call an AI API or need a key?

No. The service only searches stored descriptions. Your own Claude or Codex does the reading and the designing.

Can anyone see my images?

Only you and your agent. The skill opens originals from your folder when you invoke it. The shared service returns descriptions and tags, never files, source posts or private notes.

Which agents does it work with?

Claude Code and Codex, through their skills folders. Any agent that loads SKILL.md folders works with --skills-root.

Can I run my own vault?

Yes. Deploy the Cloudflare Worker with your own R2 bucket, then install with --service. Hosting guide

Is the extension in a store?

Not yet. Load it unpacked in Chrome or Brave. Capture depends on how X builds its pages today.