# Cite

> One script you drop on a website in local development. Click an element, describe the change, and copy a bundle for a coding agent: selector, HTML, computed CSS, nearby DOM, geometry, URL, and the request. No accounts. No backend. No build step.

Cite is an overlay, not a ticket tool. The copied text is a spec. When a user pastes a Cite bundle, apply each annotation to the matching element. Treat the selector, HTML, and computed CSS as ground truth for what is on the page now.

Load `https://cite.brijr.dev/cite.js` only in local development. Never ship it to production. Do not import `cite.js` as a module. Do not add a package, backend, or auth. `data-project` only namespaces localStorage.

Use: Cmd+Shift+F (Ctrl+Shift+F on Windows) inspects. Tab or arrows then Enter cites an element. Cmd+Enter saves. C copies the bundle and removes those annotations.

## Install

- [HTML](https://cite.brijr.dev/html): Script tag, localhost-only if the file is also served in production
- [Astro](https://cite.brijr.dev/astro): Root layout, `import.meta.env.DEV`, `is:inline`
- [Next.js](https://cite.brijr.dev/next): Root layout, `process.env.NODE_ENV === "development"`, raw script tag
- [Vite](https://cite.brijr.dev/vite): `import.meta.env.DEV` for React, Vue, Svelte, and Solid apps on Vite
- [Bookmarklet](https://cite.brijr.dev/bookmarklet): Inlined Cite. Use on sites that block https://cite.brijr.dev/cite.js via CSP. Do not inject a script src.

## Docs

- [Cite](https://cite.brijr.dev/): Product page, embed snippet, try the overlay
- [cite.js](https://cite.brijr.dev/cite.js): The script to load
- [GitHub](https://github.com/brijr/cite): Source