Integrate

Widget

Two lines of HTML give any website a live 'Can you build here?' checker — a resident types an address, the real Score engine answers with the score, grade, and factor breakdown. Built for city and county websites and the platforms that power them: it's an iframe, so it passes government CMS security reviews without a JavaScript audit.

Live demo

This is the actual widget, embedded on this page with the snippet below — try any US address. To see it in context, visit the demo city website: a full municipal Planning & Zoning page with the widget installed and themed to the city’s colors.

Install

Paste this where the checker should appear. The <script>line is optional — it auto-fits the iframe’s height as the widget expands; without it, keep the fixed height:560px, which fits every state.

Paste into any pagehtml

<iframe data-buildability
  src="https://buildability.us/embed/checker?key=bk_demo&city=Austin&state=TX"
  style="width:100%;border:0;height:560px"
  title="Buildability checker"></iframe>
<script src="https://buildability.us/embed.js" async></script>

The bk_demo key works anywhere, today — embed it on a staging site right now to evaluate. It shares a small community quota (10 checks/minute, 200/day), so production embeds need a partner key: contact uswith the domains you’ll embed on and we issue one with its own quota.

Configure

Everything is a URL parameter on the iframe src:

Embed URL anatomy

https://buildability.us/embed/checker
  ?key=bk_demo          ← your partner key
  &city=Austin          ← scopes the checker to one city
  &state=TX             ← two-letter state code
  &accent=%230b5cab     ← your brand color (URL-encoded hex)

Parameter	Required	What it does
`key`	yes (production)	Your partner key. Meters usage against your quota and authorizes your domains to frame the widget. Publishable by design — it is visible in your page source, and that is fine.
`city`	no	Scopes the checker: shown in the widget copy, and appended to bare street addresses so residents can type just "500 Main St".
`state`	no	Two-letter state code, appended with city.
`accent`	no	Your brand color as hex without the `#` (or URL-encode it as `%23`). Colors the button, focus ring, and links. Score colors are never themed — they stay on the canonical scale.

How partner keys secure the embed

Two independent controls, both tied to the key:

Origin allow-list. Each partner key names the exact origins allowed to embed (e.g. https://www.cityofaustin.gov). We enforce it with a frame-ancestorsContent-Security-Policy header, so a copied snippet on an unauthorized site simply won’t render. Without a valid key the widget only renders on buildability.us itself.
Per-partner quota.All traffic through your key shares one quota across every page and visitor — sized to the deal, not per-IP. Over quota, the widget shows residents a friendly “busy — try again in a minute” rather than an error.

What residents see

The Buildability Score (0–100) with grade and band, colored on the canonical score scale.
A resident-friendly status: “Ready to Build”, “May Need Review”, or “Challenges Found”.
Each factor’s sub-score with its plain-English note; estimated factors carry an est. badge.
A link to the full report on buildability.us, and the “Powered by Buildability” attribution — always present; co-branding is the deal.

A first-time lookup takes 10–20 seconds (live federal queries — the widget narrates the progress); repeat lookups of the same address are instant.

Accessibility (Section 508 / WCAG)

Government websites are legally required to be accessible, so the widget is built for procurement review. We are working toward WCAG 2.2 AA across the product; the widget surface is axe-core-tested (idle and result states) as part of that program, and supports:

Full keyboard operation — Tab to the field, type, Enter to check; visible focus indicators throughout.
Screen-reader announcements: progress updates while checking, and the full result (score, grade, status) announced via a polite live region; errors announced as alerts.
AA color contrast everywhere, including score-scale colors when used as text.
prefers-reduced-motion — animations reduce to static states.

Your side of the contract is one attribute: keep the title on the iframe (the install snippet includes it). That is what names the widget to screen-reader users.

Beyond the widget

Platforms integrating for many cities usually pair the widget with one of the other surfaces:

A full page: link “What can I build?” in the city site’s navigation to the city’s page on buildability.us/cities, or iframe the widget full-width on a dedicated page of the city site.
A white-label deployment: your domain, your branding, the full resident experience — contact us to scope it.