---
name: design-tokens
description: Fetch WireframeStudio design tokens for a theme as a DESIGN.md (google-labs-code/design.md format) or raw JSON via /api/design-tokens. Use when implementing a wireframe and you need the visual system (colors, typography, spacing) as tokens instead of hardcoded values.
version: 1.0.0
license: MIT
homepage: https://wireframe-studio.pages.dev
---

# design-tokens

Fetch the design tokens (colors, typography, spacing, rounded, component mappings) for a
WireframeStudio theme, so an agent implements the UI from a design system instead of guessing
literal values.

## When to use

- You are implementing a wireframe and need its visual system as tokens.
- You want a ready-to-use `DESIGN.md` (google-labs-code/design.md format) for the target theme.

Do NOT use for:
- Structure/layout — that lives in the wireframe JSON (`wireframe-schema`).
- Themes other than `blueprint`, `slate`, `minimalist` — only these are defined.

## Endpoint

```
GET https://wireframe-studio.pages.dev/api/design-tokens?theme={theme}&format={md|json}&project={name}
```

- `theme` (required-ish): `blueprint` (default) | `slate` | `minimalist`.
- `format`: `md` (default) returns a `DESIGN.md` document; `json` returns the raw token object.
- `project` (optional): name embedded in the DESIGN.md front matter.

CORS is open (`*`). Unknown themes return `400`.

## Examples

```bash
# DESIGN.md for the slate theme
curl -s "https://wireframe-studio.pages.dev/api/design-tokens?theme=slate&project=Acme"

# Raw token object
curl -s "https://wireframe-studio.pages.dev/api/design-tokens?theme=minimalist&format=json"
```

## Response

- `format=md` → `text/markdown`, a DESIGN.md with YAML front matter (`colors`, `typography`,
  `rounded`, `spacing`, `components`) plus a markdown rationale.
- `format=json` → `{ "theme": "slate", "tokens": { "background": "#0F1115", ... } }`.

## Constraints

- Stateless, no auth. Tokens are derived from the same source the WireframeStudio app uses,
  so the DESIGN.md matches what the in-app implementation prompt embeds.