WEBSITE · PLATE PRO · V1.0.1

Patchbay

A desktop synthesiser's front panel, rebuilt as a website: two oscillators, a filter, an envelope and a delay run on the Web Audio API behind a real 17-key playable keyboard, with an owner's manual and an engraved serial plate. Ordering one opens a mailto; there is no store behind the price shown.

Complete single-page websitePlate Pro · $49.50 once

Get Plate Pro · $49.50Already have Pro? Sign in ↗Open in the library ↗

Included in Plate Pro: $49.50 once at the launch price (regularly $89), no subscription, with v1 updates. One payment covers every current Pro website and film.

Taxes depend on your location. Polar shows the tax breakdown and final total at checkout.

The live site opens for Pro accounts; everyone else sees the recorded preview above. A browser is handed every file a site runs, so the runnable source is not secret: what Pro gives you is the packaged project, the editing guide, the licence and v1 updates.

WHAT YOU RECEIVE

  • The complete source: index.html, patchbay.css, patchbay.js and content.js, with no build step and no dependencies
  • content.js: identity, 16 colour tokens, front-panel copy, the 8 module header strips, per-module body copy, every socket tooltip, the owner's manual, order/pricing text and the 18 synth defaults the panel opens with
  • EDITING.md: what each field does
  • Barlow, Archivo Black and Share Tech Mono as WOFF2 with their OFL-1.1 licence files
  • README.md with the run command, and LICENSES.md

WHAT YOU CAN CHANGE

  • Identity: maker, brandShort, model, revision, assembledIn, city, power — content.js identity
  • 16 colour tokens (panel, LCD, the one LED/cable accent, CV cable) — content.js colors
  • Front-panel copy: eyebrow, logo, standfirst, keyboard hint, out-note, small labels
  • The 8 module header strips: number, name, sub-label, HP width
  • Per-module body copy across the 6 modules (HTML paragraphs)
  • Every socket tooltip
  • The owner's manual, Section 7: title, 4 sections of label/value rows, dimensioned-drawing labels, footer, fine print
  • Price, order note, contact email, and the mailto subject/body templates
  • The WRITE button label and downloaded file extension
  • The engraved serial plate
  • The 18 synth defaults (waveform, filter, envelope, delay, LFO, master, monitor) the panel opens with
  • Page head: title, meta description, theme-color, favicon, noscript text

NOT THIS

  • The hardware itself: panel, knobs, cables and the serial plate are CSS and SVG shapes, not product photography
  • The filter is two cascaded biquad stages, not a modelled analog ladder filter
  • Ordering one is a mailto: link with a prefilled subject and body; there is no server-side order flow, payment or stock/lead-time check behind the price shown
  • A light or cream panel palette (the CSS assumes a dark ground) without a CSS edit
  • Swapping a font family without also replacing its file, @font-face src and preload link
  • The audio engine, the scroll-to-routing mechanism, the drag-plug/CV-patch logic and all knob/socket/panel geometry (patchbay.js / patchbay.css)
  • The 17-key layout and its computer-key mapping
  • A 5th manual section or a different manual column layout
  • Patch loading, a patch library, Web MIDI input, velocity, or a self-oscillating AudioWorklet filter

USE IT WITH YOUR CODING AGENT

You download it. Your agent makes it yours.

  1. Get Plate Pro, or sign in if you already have it, and download the ZIP from the library.
  2. Check its SHA-256 against the one below, and extract it into a new, empty folder.
  3. Open that folder in Claude Code, Codex or Cursor. Plate never asks your agent for your password or licence key; you do the download, the agent does the edit.
  4. Paste the instructions below and fill in your project name and changes. The agent reads the included README and licences, edits the supported files, runs the site and reports what it checked.

REQUIREMENTS

The instructions to paste into your agent
Use Plate's Patchbay, project patchbay, version 1.0.1, as the starting point.
Requested result: [my project name].
My changes: [describe the changes before beginning]
Before you edit anything, ask me for the project name and the changes I want. Do not invent a brand, a client, copy or a result.

Scope: Complete single-page website.
Use the existing source and assets. Read its README and licence notices first. Preserve unrelated work and make changes in a separate project folder.
The project is a Plate Pro pack. Download it from the Plate library (https://getplate.pages.dev/library.html?project=patchbay, "Download source") while signed in to Plate with Pro; the file comes from https://getplate.pages.dev/api/pack?slug=patchbay and only with Pro. If you cannot sign in, tell me and I will download the ZIP and put it in your workspace myself.
Verify SHA-256: 65f7b382355f10ea57878a4847c05be45de20d3988daf162d71bc0483f9e6428 (208493 bytes, version 1.0.1). Extract into a new folder and follow its README to run it.
Make content changes in content.js as EDITING.md describes; the supported changes below live there. Do not rewrite the renderer or the layout to make a content change.

Supported changes:
- Identity: maker, brandShort, model, revision, assembledIn, city, power — content.js identity
- 16 colour tokens (panel, LCD, the one LED/cable accent, CV cable) — content.js colors
- Front-panel copy: eyebrow, logo, standfirst, keyboard hint, out-note, small labels
- The 8 module header strips: number, name, sub-label, HP width
- Per-module body copy across the 6 modules (HTML paragraphs)
- Every socket tooltip
- The owner's manual, Section 7: title, 4 sections of label/value rows, dimensioned-drawing labels, footer, fine print
- Price, order note, contact email, and the mailto subject/body templates
- The WRITE button label and downloaded file extension
- The engraved serial plate
- The 18 synth defaults (waveform, filter, envelope, delay, LFO, master, monitor) the panel opens with
- Page head: title, meta description, theme-color, favicon, noscript text

Requirements:
- Any current Chrome/Edge/Firefox/Safari with the Web Audio API (a webkitAudioContext fallback is included); without it the panel still renders and the display says so
- Static HTTP host; run locally with python -m http.server 8080 (or any free port) from inside the folder
- No external requests at runtime; all fonts and assets are self-hosted in the folder
- prefers-reduced-motion: the panel opens already lit with the cables fully drawn, and no scroll animation runs

Limits:
- The hardware itself: panel, knobs, cables and the serial plate are CSS and SVG shapes, not product photography
- The filter is two cascaded biquad stages, not a modelled analog ladder filter
- Ordering one is a mailto: link with a prefilled subject and body; there is no server-side order flow, payment or stock/lead-time check behind the price shown
- A light or cream panel palette (the CSS assumes a dark ground) without a CSS edit
- Swapping a font family without also replacing its file, @font-face src and preload link
- The audio engine, the scroll-to-routing mechanism, the drag-plug/CV-patch logic and all knob/socket/panel geometry (patchbay.js / patchbay.css)
- The 17-key layout and its computer-key mapping
- A 5th manual section or a different manual column layout
- Patch loading, a patch library, Web MIDI input, velocity, or a self-oscillating AudioWorklet filter

Run the whole website. Inspect the opening, middle and ending on desktop and phone. Check the actual motion, navigation, reduced motion and missing-media recovery.
Deliver the edited source, actual preview or render, exact start commands and any remaining limitations. Do not purchase services, invent claims, post or deploy without my instruction.

The library fills in your project name and changes for you: open Patchbay in the library, then "Customize prompt".

A REAL ADAPTATION

KETTLE K-2 DRIFT, a fictional synthesiser

A fresh Claude Code session (Opus 5.5) was given this project's library instructions and a brief for the front panel of an invented desktop synthesiser: new maker and model, sand panel with one teal accent, rewritten module copy, tooltips and owner's manual, and a softer, darker opening patch. It verified the archive, edited content.js, ran the result and checked desktop, phone, keyboard, reduced motion and the fallbacks. About 13 minutes, with no human help during the run; a person placed the downloaded ZIP in its folder first.

KETTLE K-2 DRIFT, a fictional synthesiser, adapted pageKETTLE K-2 DRIFT, a fictional synthesiser, adapted pageKETTLE K-2 DRIFT, a fictional synthesiser, adapted page

Everything in it is invented; nothing is a real business or claim. Outside the supported changes: The static page head in index.html, ten lines of patchbay.css where the template hard-coded orange glows, and a new poster. Still true of the result: If content.js fails to load, the original brand shows. A few details are fixed in patchbay.js (the monitor label, an orange warning flash, the saved file's format name).

CREDITS, VERSION, ARCHIVE

What travels with it

WhatSourceLicenceKeep
BarlowGoogle FontsSIL OFL 1.1Keep fonts/OFL-Barlow.txt
Archivo BlackGoogle FontsSIL OFL 1.1Keep fonts/OFL-ArchivoBlack.txt
Share Tech MonoGoogle FontsSIL OFL 1.1Keep fonts/OFL-ShareTechMono.txt
Panel, knobs, cables and the serial plateDrawn with CSS and SVG by the site's own codePart of the pack; no third-party art or product photographyNothing to credit

Archive: version 1.0.1 · 0.2 MB (208493 bytes) · 16 files · SHA-256 65f7b382355f10ea57878a4847c05be45de20d3988daf162d71bc0483f9e6428

Checked 2026-09-29: Built on 1.0.0. 1.0.1 repackages with forward-slash paths (1.0.0 used Windows backslashes and did not extract into folders on macOS or Linux), drives every glow, lamp and trace from the accent colour, and takes the monitor label prefix from content.js. Default look pixel-identical to 1.0.0 (max channel difference 1/255); monitor label unchanged. Archive extracted and compared byte for byte with its source.

Included in Plate Pro v1 updates; the archive is re-hashed whenever its bytes change · Licence terms · Support

MORE PROJECTS

Other sites and games on Plate

Every project page · Films · The catalogue as JSON