Skip to main content

Documentation Index

Fetch the complete documentation index at: https://docs.buildbetter.ai/llms.txt

Use this file to discover all available pages before exploring further.

The Chrome extension is how pages get into Prototypes. Once installed, you visit any URL and capture the page with one click — the result lands as a new prototype in your workspace.

​
Install

From /prototypes, click Install extension in the top-right. The button takes you to the Chrome Web Store: BuildBetter Prototype Capture on Chrome Web Store Install in any Chromium-based browser (Chrome, Edge, Brave, Arc, etc.).

​
Authorize

The first time you capture, the extension opens a tab to /prototype/extension-auth to grab your BuildBetter session token. The page:
  1. Reads your authenticated session
  2. Posts the token back to the extension via window.postMessage with origin "buildbetter.prototype-extension.auth"
  3. Shows “Extension authorized” and auto-closes
If you sign out of BuildBetter, you’ll need to re-authorize the next time you capture.

​
Capture a Page

1

Visit the page you want

Any URL — your product, marketing site, competitor, public dashboard.
2

Click the extension icon

Opens the capture popup.
3

(Optional) name the prototype

Defaults to the page title; rename anytime later from the list page or the editor.
4

Capture

The extension grabs the page and uploads to BuildBetter. The new prototype opens at /prototype/:id.

​
What Gets Captured

  • HTML — the full DOM. All <script> tags and inline event handlers are stripped at capture time, producing a static mockup.
  • Stylesheets — every linked and inline stylesheet inlined into the manifest, so the look matches the original even offline.
  • Assets — base64-encoded images and embedded resources.
  • Metadata — capture timestamp, user agent, viewport dimensions, origin URL.

​
Capture Behavior

  • Styling preserved — captured CSS is replayed faithfully; visual fidelity to the original is high.
  • Links rendered, not active — clicking links in the editor’s iframe is intercepted. You won’t navigate away by accident.
  • Forms preserved structurally — fields render correctly but values aren’t auto-filled on reload. Password and payment fields specifically are not stored.
  • External images stay external — image src URLs still point to the original site’s CDN. If the original removes the image, your prototype’s image will break.

​
What Doesn’t Get Captured

  • JavaScript — stripped at capture time. Captures are visual mockups.
  • Animations — anything driven by JS won’t run. Pure CSS animations and transitions are preserved.
  • Live data — what’s on the page is what you’ll see. Re-capture if the page changes.
  • Auth-walled content beyond what you saw — the extension captures what your browser actually renders. If a page requires you to be logged in, log in first, then capture.

​
Re-Capturing

To get a fresh snapshot of the same page later:
  • Capture again as a new prototype — preserves the old one for comparison.
  • Or capture and clone — from /prototypes, click New prototype → From existing capture and start a fresh iteration with the original capture as the base.

​
Security Notes

The extension uses window.postMessage with strict origin validation to hand off your session token, so a malicious site can’t intercept the handoff. Captured HTML and assets are stored server-side and only visible to your workspace.