WEBSITE · PLATE PRO · V1.0.0
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
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.
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.
- Get Plate Pro, or sign in if you already have it, and download the ZIP from the library.
- Check its SHA-256 against the one below, and extract it into a new, empty folder.
- 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.
- 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
- 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
The instructions to paste into your agent
Use Plate's Patchbay, project patchbay, version 1.0.0, 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: 2362b9ca97a38916e40838da9d531554f22120d3726e3090ca9c641008325f9b (208218 bytes, version 1.0.0). 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 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.
CREDITS, VERSION, ARCHIVE
What travels with it
| What | Source | Licence | Keep |
|---|---|---|---|
| Barlow | Google Fonts | SIL OFL 1.1 | Keep fonts/OFL-Barlow.txt |
| Archivo Black | Google Fonts | SIL OFL 1.1 | Keep fonts/OFL-ArchivoBlack.txt |
| Share Tech Mono | Google Fonts | SIL OFL 1.1 | Keep fonts/OFL-ShareTechMono.txt |
| Panel, knobs, cables and the serial plate | Drawn with CSS and SVG by the site's own code | Part of the pack; no third-party art or product photography | Nothing to credit |
MORE PROJECTS