Specpin

Pin living business specs onto the elements of your running web UI. Git-native, local-first, framework-agnostic.

Specpin attaches business specifications (rules, descriptions, acceptance criteria) directly onto the elements of a running web UI, then renders them in-browser as you hover or browse. It is NOT a spec-driven code generator: it generates no application code. It is a knowledge layer that pins living, Git-versioned documentation onto the interface you already have. Specs live as JSON in your repo's `.specs/` directory and are served to the extension by a small local Go sidecar over token-authenticated localhost. Nothing leaves your machine. Features: - Pin specs onto live elements: resilient multi-signal fingerprint matching (test-id, aria, selector, xpath, text, position) so specs survive refactors, scoped to their page by a URL glob. - Match confidence and page health: see how each spec matched (exact anchor vs. selector), review fragile matches, and drop in a data-spec-id attribute for exact matching. - Three display modes: tooltip, side panel, and a draggable modal renderer. Switch with one click or Alt+Shift+M. - Manual capture: click an element and author a spec in place, no leaving the page. Toggle capture with Alt+Shift+C. - Writable local projects: edit, capture, create, delete, and group-zip export specs, even without a running sidecar. - Multi-project connections: one extension serves many projects at once, routed to each page by origin, with per-project enable/disable and source badges (sidecar vs local). - Guide mode: spec-driven onboarding tours in two scopes (team, committed to your repo; personal, per-origin), with a spotlight overlay and an anchored popover. - Graph views: visualize your app as screen-transition and status-flow diagrams — navigations are auto-captured as you browse (per-project, opt-in), edited in an in-browser graph editor, and committed to your repo. - Spec-first authoring: draft a spec from a screenshot or design before the UI exists (pending specs), then bind it to a real element once the frontend ships. Author right inside the extension's spec sheet page, fully offline. - Side panel surface: open Specpin in Chrome's side panel with inline spec detail and live auto-refresh. - Spec search: live client-side filter by title, file, tags, and description. - Multi-language spec content: locale-keyed strings with an in-browser language toggle and a tabbed per-locale editor. - Markdown-formatted specs: descriptions and business rules carry a safe Markdown subset (bold, italic, inline code, links, lists), authored via a toolbar and rendered across every surface. - User-selectable theme: System / Light / Dark, with dual-theme design tokens. - Trilingual interface (EN + VI + JA), independent from the spec content language. Secure by default: the sidecar binds 127.0.0.1 by default (remote use is opt-in over your own HTTPS reverse proxy), uses bearer-token auth, accepts only extension-origin CORS, and guards writes against path traversal. Open-source, built with Manifest V3. No data collection, no tracking, no remote code.