---
## Source-first architecture
AgnosticUI components are copied into your project at install time.
They live in your repo (not hidden inside `node_modules`):
- Full control over the source
- Native integration with your framework
- AI-readable, high-fidelity context
---
## You own the source (and the Context)
```bash
cd your-project
npx agnosticui-cli init --framework vue # or react, lit, svelte
npx agnosticui-cli add Button Card Input
```
The component source lands **directly in your project**. Readable, editable, and yours.
```shell
src/
components/
ag/
Button/
Button.vue ← your file now
Button.css ← your tokens now
Button.test.ts ← your tests now
```
Components land under `src/components/ag/` by default: a dedicated namespace that keeps AgnosticUI components separate from your own. Configurable if you prefer otherwise.
### 🤖 AI-Native by Design
Because the code is local, it solves the "Black Box" problem of traditional libraries hidden in `node_modules`.
**Cursor · Claude · Copilot · Windsurf · Aider · Gemini · Replit · Kiro · Antigravity**
Every tool sees the **raw source**. This creates a high-fidelity environment for **Generative UI** and **Agent-driven interfaces**:
- **Reduce Hallucination:** No more "invented" props or APIs. Since the LLM reads local files like any other code, it knows exactly what is possible.
- **Better Token Efficiency:** Using semantic HTML and standard CSS provides "clean context." Agents spend fewer tokens to understand the UI, leading to faster, more accurate generations.
- **Agent Skills:** Treat [AgnosticUI Playbooks](https://www.agnosticui.com/playbooks/login.html) as pre-defined skills. Use them to prompt an agent to scaffold complex, accessible workflows (Login, Onboarding, Discovery Dashboard, Support Center, Data Grids) using the local components it already "sees."
This is the architecture for the next era of development: **context-aware, framework-agnostic, and AI-ready.**
The schema-driven layer ships with three companion documents:
- [`v2/docs/sdui-architecture.md`](./v2/docs/sdui-architecture.md) — full system architecture: codegen pipeline, node graph model, renderers, CI gates, and key design decisions
- [`v2/docs/llm-prompt-guide.md`](./v2/docs/llm-prompt-guide.md) — copy-paste system prompt template and few-shot examples for generating valid `AgNode[]` graphs
- [`v2/docs/schema-coverage.md`](./v2/docs/schema-coverage.md) — per-component SDUI coverage registry, renderer parity status, and omission reasons
---
## Built once. Runs everywhere.
AgnosticUI's components are authored as **Lit Web Components**, a standards-based layer over native Custom Elements. The CLI wraps them for your framework at copy time.
