Scaffold

For AI developers

Use this UI kit with Cursor, Copilot, or any AI coding assistant: discover components and templates, then copy production-ready code.

Zero dependency. Copy code into your repo—no design-system package to install or upgrade. You own the code.

Using with Cursor / Copilot

  1. Open a component or template page (e.g. Components → Button, Templates → Prompt input bar).
  2. Switch to the Code tab.
  3. Copy the snippet and paste it into your app. Imports use @/components/ui/<name>; ensure your project has the same alias or update the paths.

Manifest API for AI tools

GET /api/manifest returns a JSON catalog of all components and templates for use by AI tools. The response includes:

  • components — slug, name, description, category, importPath, code, and optional examples (title + code). When present: props, dependencies, whenToUse, alternatives.
  • templates — slug, name, description, type (block or page), code, optional examples, and when present patternCategory (e.g. Streaming, Tool use).
  • recipes — slug, name, description, blockSlugs (ordered), layoutHint. Use for full-screen flows; GET /api/recipes/<slug> returns blocks with code for each.

You can fetch the manifest from the same origin as this site (e.g. https://yoursite.com/api/manifest) to let an AI assistant list and suggest components and templates with correct copy-paste snippets.

Optional: ?version=0.3.0 or Accept: application/vnd.design-system.v1+json for versioned responses.

Context and Cursor rule

A curated context block tells an AI assistant which components and templates to use and when.GET /api/context returns { markdown, cursorRule }. Use ?format=markdown for plain markdown.

For Cursor: add a project rule (e.g. in .cursor/rules) or paste the cursorRule from the response so the assistant uses this design system when building UI.

Design tokens (copy-paste)

Paste design tokens (CSS variables for colors, radius, glass) so copied components look consistent. Fetch GET /api/tokens for a ready-to-paste CSS snippet, or see Design tokens for the full snippet and usage.