A local html page that pulls a random item from each of up to four Are.na boards and displays them side by side. Shuffle to get a new set, lock cards you want to keep, and save the whole thing as a portable zip.

Designed to be set as my homepage, to generate ideas to draw from. Vibe coded with Claude, because I never really learned your fancy code back in the day.

arena-picks.html       — the app
arena-config.js        — your personal settings (not committed to git)
arena-config.example.js — template to copy from

1. Get an Are.na personal access token Go to are.na/settings/personal-access-tokens and create one. Read scope is all you need.

2. Create your config file Copy arena-config.example.js to arena-config.js and fill in your token and board slugs.

The slug is the last segment of the board URL. For are.na/kim/drawing-references the slug is drawing-references — just that part, no username prefix.

const ARENA_CONFIG = {
  token: "your-token-here",
  boards: [
    "your-first-board-slug",
    "your-second-board-slug",
    "your-third-board-slug",
    "your-fourth-board-slug",
  ],
  allowedTypes: new Set(["Image", "Text", "Link", "Embed", "Attachment"]),
  maxRetries: 8,
};

3. Open arena-picks.html in a browser Double-click it, or drag it onto a browser window. No server or build step needed.

• Shuffle ↻ — loads a new random item for each unlocked card
• Lock — hover a card to reveal the lock icon (top right of the image). Click to lock; locked cards are skipped on the next shuffle
• Save ↓ — downloads a zip containing index.md (YAML frontmatter and one section per card) plus any images that could be fetched

arena-picks-YYYY-MM-DD-HH-MM.zip
  index.md
  images/
    block-12345.jpg
    block-67890.png
    ...

The markdown output (example here) includes the board name, Are.na block link, source URL (for links), and inline image references using relative paths.

All colours are CSS custom properties at the top of the stylesheet in arena-picks.html — easy to retheme without touching anything else. The app follows your macOS light/dark setting automatically; the toggle in the header overrides it manually.

To show only certain block types, edit allowedTypes in arena-config.js.

No build tools or package manager. One CDN library: JSZip 3.10.1 (used only for the save feature, loaded from jsDelivr).

• Are.na's signed CDN image URLs expire after roughly 24 hours, so saved zip images are a point-in-time snapshot — worth keeping if you want them
• arena-config.js is in .gitignore to protect your token; use arena-config.example.js as a template for sharing or new installs