# Design Studio AI

> Design Studio AI is an open-source, agent-first workspace for structured web interfaces, slides, reports, wireframes, 3D scenes, and timeline video. People and agents share one revision-checked document through the web UI, REST, CLI, MCP, and experimental WebMCP.

Documentation is public. Project, asset, credential, and provider operations require owner authorization. Examples use secure environment injection, never real keys. Generation requires BYOK. REST design generation returns a proposal; the guided UI explicitly saves its first validated draft after scope approval. Publication is separate.

## Start here

- [Beginner guide](https://beta.studio.agentkit.best/guide.md): Visual workflow, useful briefs, review, export, and agent connections.
- [Quickstart](https://beta.studio.agentkit.best/docs/quickstart.md): Install the released CLI, inspect templates, and create a project.
- [Documents and revisions](https://beta.studio.agentkit.best/docs/revisions.md): Schema, targeted edits, expectedRevision, and conflicts.

## Reference

- [REST API](https://beta.studio.agentkit.best/docs/api.md): The complete HTTP surface for projects, assets, generation, and delivery.
- [CLI commands](https://beta.studio.agentkit.best/docs/cli.md): A stateless, scriptable interface built for your agent workflow.
- [Network MCP](https://beta.studio.agentkit.best/docs/mcp.md): Connect remote agents through Streamable HTTP and OAuth.
- [Browser WebMCP](https://beta.studio.agentkit.best/docs/webmcp.md): Let an in-browser agent work with the open, unsaved canvas.
- [API keys & access](https://beta.studio.agentkit.best/docs/api-keys.md): Create, inject, and revoke credentials for your own workspace.
- [Activity & usage](https://beta.studio.agentkit.best/docs/observability.md): Trace actions, investigate errors, and inspect measured provider usage.
- [Live JSON Schemas](https://beta.studio.agentkit.best/api/schema): Document, targeted-operation, interview, and scope transport schemas; semantic validation also runs on writes.
- [Live catalog](https://beta.studio.agentkit.best/api/catalog): Templates, themes, and reusable blocks.

## Optional

- [Self-hosting and resources](https://beta.studio.agentkit.best/docs/self-hosting.md): Docker, Node, Cloudflare, backups, and capability boundaries.
- [Full documentation](https://beta.studio.agentkit.best/llms-full.txt): All documentation inline in one text file.
- [Source and releases](https://github.com/bestagentkits/design-studio-ai): MIT source, CLI tarball, and installable agent skill.

---

Source: https://beta.studio.agentkit.best/docs

# Quickstart

> Connect your agent and create your first editable design.

THE DEVELOPER WORKSPACE

## One design. Every way to work.

Give your agent the same canvas, assets, and revision history you use in the studio.

Structured document Targeted edits Real output

## From a brief to a saved design

01

### Connect your agent

Sign in to the studio, create an API key, and inject it into your agent environment.

[Manage API keys](https://beta.studio.agentkit.best/?settings=agents)

02

### Choose a starting point

Inspect templates, themes, and the document schema. Use existing page and node IDs.

[Explore the CLI](https://beta.studio.agentkit.best/docs/cli)

03

### Edit, inspect, export

Make focused changes, save against the revision you read, and inspect the actual artifact.

[Understand revisions](https://beta.studio.agentkit.best/docs/revisions)

```
npm install -g https://github.com/bestagentkits/design-studio-ai/releases/download/v0.3.0/bestagentkits-design-studio-ai-0.3.0.tgz

# Inject DESIGN_STUDIO_API_KEY using your secret manager.
export DESIGN_STUDIO_URL=https://beta.studio.agentkit.best
dsa health
dsa templates list
dsa schema
dsa projects list
```

```
dsa projects create --name "Product story" --template product-deck

# Use the ID and revision returned by the server.
dsa projects get PROJECT_ID
dsa projects export PROJECT_ID --format png --revision OBSERVED_REVISION --output preview.png
```

**Bring your own provider, when you need one** Templates and direct edits do not need an AI-provider key. Text or media generation uses your configured BYOK connection and can incur provider charges. A proposal is never silently saved over your project.

[Live template & theme catalog](https://beta.studio.agentkit.best/api/catalog)[Installable agent skill](https://github.com/bestagentkits/design-studio-ai/releases/download/v0.3.0/design-studio-ai-skill.zip)[Live document, operation & interview schemas](https://beta.studio.agentkit.best/api/schema)[Create your API key](https://beta.studio.agentkit.best/?settings=agents)

---

Source: https://beta.studio.agentkit.best/docs/revisions

# Documents & revisions

> Make focused changes while keeping human and agent work in sync.

A project has a saved `revision`; its document has a separate `schemaVersion`. Read the revision before changing the design. Every full-document save checks it atomically.

-  **Read.**  Get the document and revision together.
-  **Change.**  Apply a small operation array to the actual node IDs.
-  **Save.**  Send the observed revision, not a guessed newer number.
-  **Reconcile.**  On 409, read the current design and adapt your edit.

```
[
  {
    "op": "update-node",
    "nodeId": "ACTUAL_NODE_ID",
    "changes": { "text": "The next chapter" }
  }
]
```

```
dsa projects get PROJECT_ID
dsa schema --operations
dsa projects document patch PROJECT_ID \
  --revision OBSERVED_REVISION --file operations.json
```

**The document is shared, not duplicated per client** REST, MCP, WebMCP, and the CLI all use DesignDocument v1. The schema validates IDs, page parents, geometry, asset ownership, and timeline references. Keep the project ID and kind. Never use full regeneration to bypass a conflict.

## Proposal versus saved work

```
dsa generate PROJECT_ID --provider openai \
  --revision OBSERVED_REVISION --prompt-file brief.txt --output proposal.json

# Inspect the proposal before this separate write.
dsa projects document put PROJECT_ID \
  --revision OBSERVED_REVISION --file proposal.json
```

Media generation and uploads return assets independently of the document. Add the asset reference and node, inspect the result, then save. Publishing exposes a frozen snapshot of the saved revision; it does not automatically publish later edits.

## Interview, scope, and explicit approval

The brief stores the original request, contextual questions, answers, and scope separately from the design. Its `revision` is independent of the document revision; use zero only to create the first brief. Read the actual brief before every update.

- Save a clear request. An external agent can supply its own interview, or call the configured BYOK provider to ask contextual questions.
- Show the questions to the human. Save their answers; never manufacture an answer to make the workflow pass.
- Review a scope covering objective, audience, visual direction, deliverables, constraints, and acceptance criteria.
- Approve only after explicit human agreement. Every later brief or scope edit invalidates that approval.
- Generate and inspect the design as a separate action. Scope approval never publishes anything.

```
{
  "request": "Create a six-slide product introduction. Ask me for missing facts."
}
```

```
dsa brief put PROJECT_ID --revision 0 --file brief.json
dsa brief get PROJECT_ID

# Optional: invokes your configured provider and may incur charges.
dsa brief interview PROJECT_ID --revision OBSERVED_BRIEF_REVISION --provider openai

# After explicit human approval of the current answered scope:
dsa brief approve PROJECT_ID --revision OBSERVED_BRIEF_REVISION
```

Read the [live interview and scope schemas](https://beta.studio.agentkit.best/api/schema) before supplying an external agent's structured response. Questions support text, one choice, or multiple choices. On a brief conflict, reload and reconcile its current questions and answers.

## Inspect before delivery

```
dsa projects check PROJECT_ID
```

Preflight returns actionable findings with node/page IDs, severity, counts, and limitations. It estimates overflow, text fit, opaque-hex contrast, media readiness, and export duration. It does not composite overlapping backgrounds, measure every font, inspect animated extremes, or certify accessibility. Review the rendered design and actual export.

## Reusable design systems

In the editor, choose  **Manage design systems**  to create a library of tokens, component variants and reusable compositions. Capture the selected component or current page, edit its saved definition, then create a version before applying or inserting it.

Library `version` and project `revision` are separate. Applying a saved version copies its tokens/system into the project while retaining authored component overrides and records the pinned library version. Later library edits do not change existing projects automatically. Inserting a composition copies its hierarchy with fresh IDs; deleting a library leaves previously embedded project content intact.

Use `dsa design-systems schema`, the [live shared schemas](https://beta.studio.agentkit.best/api/schema), or [OpenAPI reference](https://beta.studio.agentkit.best/api/openapi) for complete validated definitions and request shapes. On a version conflict, read the current definition and reconcile changes before saving.

[Targeted operation implementation](https://github.com/bestagentkits/design-studio-ai/blob/main/src/shared/operations.ts)

---

Source: https://beta.studio.agentkit.best/docs/api

# REST API

> The complete HTTP surface for projects, assets, generation, and delivery.

Base URL: https://beta.studio.agentkit.best. Bodies are JSON unless stated otherwise. Use Authorization: Bearer with a securely injected API key. Cookie writes require a trusted Origin. MCP OAuth cannot manage permanent credentials or provider keys. Replace path IDs and illustrative placeholders with values read from the API.

## GET /api/connections/agent-recipients

List owned active OAuth authorization identities for explicit connector grants; no tokens

Authentication: Interactive owner session.

### Request

```
No body; see live OpenAPI for query parameters.
```

### Response

```
See live OpenAPI and the operation status returned by the server.
```

## POST /api/connectors/github/authorize

Begin separate GitHub App authorization for a verified installation

Authentication: Interactive owner session.

### Request

```
{"connectionId":"","expectedRevision":1,"installationId":""}
```

### Response

```
See live OpenAPI and the operation status returned by the server.
```

## GET /api/connectors/github/callback

Complete one-use GitHub authorization bound to the initiating session

Authentication: Interactive owner session.

### Request

```
No body; see live OpenAPI for query parameters.
```

### Response

```
See live OpenAPI and the operation status returned by the server.
```

## GET /api/connectors/github/repositories

List repositories accessible to the user and selected GitHub installation; connectionId and page query parameters

Authentication: Interactive owner session.

### Request

```
No body; see live OpenAPI for query parameters.
```

### Response

```
See live OpenAPI and the operation status returned by the server.
```

## POST /api/connectors/github/resolve

Resolve a selected repository branch or tag to an immutable commit

Authentication: Interactive owner session.

### Request

```
{"connectionId":"","repositoryId":"","ref":"main"}
```

### Response

```
See live OpenAPI and the operation status returned by the server.
```

## POST /api/connectors/github/webhook

Receive signature-verified GitHub installation and authorization revocations

Authentication: Protocol-specific authentication.

### Request

```
{}
```

### Response

```
See live OpenAPI and the operation status returned by the server.
```

## POST /api/projects/:id/sources/:sourceId/asset

Copy a granted image snapshot into isolated project assets without changing the document

Authentication: Owner session or explicit project connector grant.

### Request

```
{}
```

### Response

```
See live OpenAPI and the operation status returned by the server.
```

## POST /api/projects/:id/connector-operations/:operationId/reconcile

Reconcile an uncertain Drive upload or GitHub PR using recorded identities; never repeats external writes

Authentication: Owner session or explicit project connector grant.

### Request

```
{"expectedRevision":1}
```

### Response

```
See live OpenAPI and the operation status returned by the server.
```

## GET /api/projects/:id/connector-operations/:operationId/artifact

Download an authorized prepared PDF, PPTX or React ZIP for inspection before upload

Authentication: Owner session or explicit project connector grant.

### Request

```
No body; see live OpenAPI for query parameters.
```

### Response

```
See live OpenAPI and the operation status returned by the server.
```

## POST /api/connectors/google-drive/authorize

Begin separate session-bound Google Drive authorization

Authentication: Interactive owner session.

### Request

```
{"connectionId":"","expectedRevision":1}
```

### Response

```
See live OpenAPI and the operation status returned by the server.
```

## GET /api/connectors/google-drive/callback

Redeem a one-use Google callback for the initiating session

Authentication: Interactive owner session.

### Request

```
No body; see live OpenAPI for query parameters.
```

### Response

```
See live OpenAPI and the operation status returned by the server.
```

## POST /api/connectors/google-drive/picker

Obtain a transient selected-account access token for Google Picker; never returns refresh credentials

Authentication: Interactive owner session.

### Request

```
{"connectionId":""}
```

### Response

```
See live OpenAPI and the operation status returned by the server.
```

## POST /api/projects/:id/connector-operations/:operationId/continuation

Supply explicitly reviewed input to a paused MCP operation; creates a separately approved continuation

Authentication: Interactive owner session.

### Request

```
{"expectedRevision":1,"inputResponses":{}}
```

### Response

```
See live OpenAPI and the operation status returned by the server.
```

## GET /api/projects/:id/runs

List saved run metadata without advancing

Authentication: Owner session or explicit project connector grant.

### Request

```
No body; see live OpenAPI for query parameters.
```

### Response

```
See live OpenAPI and the operation status returned by the server.
```

## POST /api/projects/:id/runs

Persist a bounded run at exact document and brief versions

Authentication: Owner session or explicit project connector grant.

### Request

```
{"provider":"openai","prompt":"Refine design","bindingIds":[],"sourceSnapshotIds":[],"expectedDocumentRevision":1,"expectedBriefRevision":1,"idempotencyKey":"unique-request-key"}
```

### Response

```
See live OpenAPI and the operation status returned by the server.
```

## GET /api/projects/:id/runs/:runId

Read run status, authorized proposal and provider usage

Authentication: Owner session or explicit project connector grant.

### Request

```
No body; see live OpenAPI for query parameters.
```

### Response

```
See live OpenAPI and the operation status returned by the server.
```

## POST /api/projects/:id/runs/:runId/advance

Advance exactly one run step with current grants

Authentication: Owner session or explicit project connector grant.

### Request

```
{"expectedRevision":1}
```

### Response

```
See live OpenAPI and the operation status returned by the server.
```

## POST /api/projects/:id/runs/:runId/cancel

Cancel future steps and preserve uncertain in-flight outcomes

Authentication: Owner session or explicit project connector grant.

### Request

```
{"expectedRevision":1}
```

### Response

```
See live OpenAPI and the operation status returned by the server.
```

## GET /api/projects/:id/runs/:runId/proposal

Revalidate a completed unsaved proposal against current authority and versions

Authentication: Owner session or explicit project connector grant.

### Request

```
No body; see live OpenAPI for query parameters.
```

### Response

```
See live OpenAPI and the operation status returned by the server.
```

## GET /api/projects/:id/sources

List private source metadata; agent results are limited to current source grants

Authentication: Owner session or explicit project connector grant.

### Request

```
No body; see live OpenAPI for query parameters.
```

### Response

```
See live OpenAPI and the operation status returned by the server.
```

## GET /api/projects/:id/sources/:sourceId

Download an authorized immutable source as inert data

Authentication: Owner session or explicit project connector grant.

### Request

```
No body; see live OpenAPI for query parameters.
```

### Response

```
See live OpenAPI and the operation status returned by the server.
```

## POST /api/projects/:id/sources/:sourceId/refresh

Import a new source snapshot without replacing existing content or brief

Authentication: Owner session or explicit project connector grant.

### Request

```
{}
```

### Response

```
See live OpenAPI and the operation status returned by the server.
```

## DELETE /api/projects/:id/sources/:sourceId

Remove an owned source snapshot and invalidate dependent work

Authentication: Interactive owner session.

### Request

```
No body; see live OpenAPI for query parameters.
```

### Response

```
See live OpenAPI and the operation status returned by the server.
```

## POST /api/projects/:id/connections/:bindingId/sources

Import one selected MCP resource or Drive file as an immutable source snapshot

Authentication: Owner session or explicit project connector grant.

### Request

```
{"uri":"resource://selected"}
```

### Response

```
See live OpenAPI and the operation status returned by the server.
```

## GET /api/projects/:id/connector-operations

List the latest 50 operation records without private payloads

Authentication: Owner session or explicit project connector grant.

### Request

```
No body; see live OpenAPI for query parameters.
```

### Response

```
See live OpenAPI and the operation status returned by the server.
```

## POST /api/projects/:id/connector-operations

Prepare a selected tool operation against exact observed versions; unknown effects require human approval

Authentication: Owner session or explicit project connector grant.

### Request

```
{"bindingId":"","action":"","arguments":{},"idempotencyKey":"unique-request-key","expectedVersions":{"connectionRevision":1,"credentialVersion":1,"policyRevision":1,"documentRevision":1,"briefRevision":0,"sourceSnapshotIds":[]}}
```

### Response

```
See live OpenAPI and the operation status returned by the server.
```

## GET /api/projects/:id/connector-operations/:operationId

Inspect an operation and authorized private payload without advancing it

Authentication: Owner session or explicit project connector grant.

### Request

```
No body; see live OpenAPI for query parameters.
```

### Response

```
See live OpenAPI and the operation status returned by the server.
```

## POST /api/projects/:id/connector-operations/:operationId/execute

Claim approved operation once; uncertain results are never replayed

Authentication: Owner session or explicit project connector grant.

### Request

```
{"expectedRevision":1}
```

### Response

```
See live OpenAPI and the operation status returned by the server.
```

## POST /api/projects/:id/connector-operations/:operationId/decision

Approve once or deny the exact operation in an authenticated browser session

Authentication: Interactive owner session.

### Request

```
{"expectedRevision":1,"decision":"approve"}
```

### Response

```
See live OpenAPI and the operation status returned by the server.
```

## POST /api/projects/:id/connector-operations/:operationId/cancel

Cancel own pending operation with revision protection

Authentication: Owner session or explicit project connector grant.

### Request

```
{"expectedRevision":1}
```

### Response

```
See live OpenAPI and the operation status returned by the server.
```

## GET /api/projects/:id/connections

List project connections

Authentication: Owner session or explicit agent discovery grants.

### Request

```
Project ID.
```

### Response

```
{ connections }; agent selections are restricted by their grants.
```

Requires CONNECTORS_ENABLED. Human sessions can inspect disconnected bindings for recovery; agents receive only authorized connected bindings.

## POST /api/projects/:id/connections

Bind a project connection

Authentication: Interactive session and matching Origin only.

### Request

```
connectionId, role and explicit selection; see OpenAPI.
```

### Response

```
201 { binding } with policyRevision.
```

Creates no agent authority. Grant access separately.

## DELETE /api/projects/:id/connections/:bindingId

Remove a project connection

Authentication: Interactive session and matching Origin only.

### Request

```
{ expectedPolicyRevision }
```

### Response

```
{ ok }; related grants revoked, snapshots removed and dependent work invalidated.
```

## POST /api/projects/:id/connections/:bindingId/grants

Grant project connector access

Authentication: Interactive session and matching Origin only.

### Request

```
recipient, expectedPolicyRevision, capabilities, selection and expiresAt; see OpenAPI.
```

### Response

```
201 { grant }.
```

Selection must be within the binding and expiry within 90 days. API-key, OAuth and WebMCP access are separate.

## DELETE /api/projects/:id/connections/:bindingId/grants/:grantId

Revoke connector access

Authentication: Interactive session and matching Origin only.

### Request

```
Project, binding and grant IDs.
```

### Response

```
{ ok }; subsequent authorization fails.
```

## GET /api/connections

List external connection metadata

Authentication: Owner session; agents require projectId and explicit discovery grant.

### Request

```
Optional projectId query; required for API, OAuth and WebMCP callers.
```

### Response

```
{ connections }; no credentials.
```

Operator must enable CONNECTORS_ENABLED. Connector workflows are experimental and require configured external accounts. Tool-assisted runs use explicit approvals and return unsaved proposals.

## GET /api/connections/:connectionId

Read connection metadata

Authentication: Owner session or explicit project discovery grant.

### Request

```
Connection ID; projectId query for agents.
```

### Response

```
{ connection } with status and revision.
```

## POST /api/connections

Create pending connection

Authentication: Interactive session and matching Origin only.

### Request

```
displayName and config; see OpenAPI schema.
```

### Response

```
201 { connection }; pending until verified.
```

Never put credentials in endpoint URLs. Native connector authorization is not enabled by creating metadata.

## POST /api/connections/:connectionId/disconnect

Disconnect and revoke connector authority

Authentication: Interactive session and matching Origin only.

### Request

```
{ expectedRevision }
```

### Response

```
{ connection }; credentials removed, grants revoked, active work invalidated.
```

## POST /api/connectors/mcp/connect

Verify anonymous or bearer MCP

Authentication: Interactive session and matching Origin only.

### Request

```
connectionId, expectedRevision, optional accessToken in request body.
```

### Response

```
Verified connection metadata and negotiated protocol; no credential.
```

Successful connection does not establish catalog or tool access. API, OAuth and WebMCP callers cannot manage setup.

## POST /api/connectors/mcp/authorize

Start outgoing MCP OAuth

Authentication: Interactive session and matching Origin only.

### Request

```
connectionId, expectedRevision, options; modern CIMD or registered client, explicit legacy DCR.
```

### Response

```
Authorization URL and new revision.
```

New authorization revokes previous grants. Callback is fixed to this installation.

## GET /api/connectors/mcp/client-metadata

Read OAuth client metadata

Authentication: Public when connectors enabled.

### Request

```
No body.
```

### Response

```
Canonical client ID and exact redirect URI; no secret.
```

## GET /api/connectors/mcp/callback

Complete outgoing MCP OAuth

Authentication: Original signed-in browser session.

### Request

```
Authorization server callback state, code, iss or error.
```

### Response

```
Verified connection metadata.
```

One-use state; owner, session, issuer, resource and revision checked. Callback cannot grant local agent authority.

## GET /api/observability/summary

Summarize account activity and measured usage

Authentication: Session or Bearer; owner default, configured operator for scope=all.

### Request

```
Query: scope=owner|all; days=1..30 (default7); projectId, actorId (all only), channel, kind, status, action.
```

### Response

```
{ scope, days, totals, usage, byAction, byActor, byProvider, coverage }
```

Unknown measurements remain null. OAuth cannot read all-account scope.

## GET /api/observability/events

Read paginated activity logs

Authentication: Session or Bearer; owner default.

### Request

```
Summary filters plus limit=1..100 (default50), cursor from previous page.
```

### Response

```
{ events, nextCursor }; safe metadata only, 30-day retention.
```

## GET /api/observability/trace/:id

Follow correlated request steps

Authentication: Session or Bearer; owner default.

### Request

```
Trace ID from X-Request-ID or event. Query: scope, days (default7; maximum30).
```

### Response

```
{ traceId, events, truncated }; 404 for unavailable traces.
```

## POST /api/observability/client-events

Record an allowlisted browser event

Authentication: Same-origin browser; owned project/correlation when supplied.

### Request

```
{ event, page?, action?, projectId?, requestId?, outcome?, errorCode? }; strict enums in OpenAPI schema.
```

### Response

```
Accepted telemetry; optional PostHog forwarding is isolated from product operations.
```

Never send arbitrary text, credentials, names, URLs or exception messages. Not exposed as an agent mutation tool.

## GET /api/health

Check service health

Authentication: Public.

### Request

```
No body.
```

### Response

```
{ "ok": true, "service": "design-studio-ai" }
```

## GET /api/schema

Read live JSON Schemas

Authentication: Public.

### Request

```
No body.
```

### Response

```
{ document: JSONSchema, operations: JSONSchema, designSystem: JSONSchema, interview: JSONSchema, scope: JSONSchema }; semantic validation still runs on writes.
```

## GET /api/openapi

Discover API operations and request schemas

Authentication: Public.

### Request

```
No body.
```

### Response

```
OpenAPI document with path/query parameters, multipart uploads, and shared component schemas.
```

## GET /api/design-systems

List your design systems

Authentication: Session or Bearer token; library owner.

### Request

```
No body.
```

### Response

```
{ systems: DesignSystem[] }; latest saved versions for this owner.
```

## POST /api/design-systems

Create a reusable design system

Authentication: Session or Bearer token; library owner.

### Request

```
Definition object matching /api/schema → designSystem.
```

### Response

```
201 { system }; initial version is 1.
```

Includes theme tokens, component variants and reusable page compositions. Private media references cannot be captured; embed media or use public HTTPS URLs.

## GET /api/design-systems/:id

Read a library version

Authentication: Session or Bearer token; library owner.

### Request

```
Optional positive integer query: version. Omit for latest.
```

### Response

```
{ system: { id, version, definition, createdAt } }
```

## GET /api/design-systems/:id/versions

List immutable library versions

Authentication: Session or Bearer token; library owner.

### Request

```
No body.
```

### Response

```
{ versions: [{ version, createdAt }] }; newest first.
```

## PUT /api/design-systems/:id

Append a library version

Authentication: Session or Bearer token; library owner.

### Request

```
{ expectedVersion, definition }; read the definition and its version first.
```

### Response

```
{ system }; stale expectedVersion returns 409.
```

Previous definitions stay immutable. Never substitute a newer version number to force stale content through a conflict.

## POST /api/design-systems/:id/apply

Apply a saved design system

Authentication: Session or Bearer token; project owner.

### Request

```
{ projectId, expectedRevision, version? }
```

### Response

```
{ project }; project revision increments.
```

Own both library and project. Optional version selects a saved library version. Applies tokens/system while preserving authored component overrides; pins the library version in the project.

## POST /api/design-systems/:id/insert

Insert a library item

Authentication: Session or Bearer token; project owner.

### Request

```
{ projectId, expectedRevision, pageId, itemId, version? }
```

### Response

```
{ project }; inserts the saved component/composition with fresh node IDs and remapped hierarchy/interactions.
```

## DELETE /api/design-systems/:id

Delete a design-system library

Authentication: Session or Bearer token; library owner.

### Request

```
No body.
```

### Response

```
{ "ok": true }
```

Deletes this owned library and its versions. Previously applied project content remains embedded.

## GET /api/fonts

Discover Google Fonts

Authentication: Session or Bearer token.

### Request

```
Optional q query, maximum 200 characters; matches family/category without case sensitivity.
```

### Response

```
{ fonts, source, message, fetchedAt? }; source is live, cache, or fallback.
```

The full catalog uses an operator Google Fonts API key. Without it, returns clearly labeled curated starter families. Choosing a Google font loads its face separately.

## GET /api/providers/:provider/models

Discover provider model IDs

Authentication: Account session or API key.

### Request

```
Provider: openai|anthropic|gemini|openrouter|fal|deepseek|leonardo|grok|custom-<slug>. Optional q query, maximum 200 characters; matches ID/name/category.
```

### Response

```
{ models, source, message, fetchedAt?, truncated? }
```

Uses the saved provider connection. Custom endpoints and unavailable connections return labeled starter suggestions; manual model IDs remain available. OAuth MCP credentials cannot call this endpoint. No raw provider key is returned.

## GET /api/catalog

Read built-in design resources

Authentication: Public.

### Request

```
No body.
```

### Response

```
{ themes, templates, blocks }
```

## GET /api/config

Read public configuration

Authentication: Public.

### Request

```
No body.
```

### Response

```
Public feature configuration, including googleClientId, allowRegistration, githubEnabled, observability eligibility/retention, and analytics availability. Never includes provider keys or server secrets.
```

## POST /api/auth/register

Create an account

Authentication: Public; matching Origin header.

### Request

```
{ "email": "you@example.com", "password": "<12–128 characters>", "name": "Your name" }
```

### Response

```
201 { user: { id, email, name } } + HttpOnly session cookie.
```

Registration must be enabled by the operator. Email is normalized; name is optional. Rate limited.

## POST /api/auth/login

Start an email/password session

Authentication: Public; matching Origin header.

### Request

```
{ "email": "you@example.com", "password": "<your password>" }
```

### Response

```
{ user: { id, email, name } } + HttpOnly session cookie.
```

## GET /api/auth/me

Read the current account

Authentication: Optional session or Bearer token.

### Request

```
No body.
```

### Response

```
{ user: { id, email, name } | null }
```

## GET /api/auth/github

Start GitHub sign-in

Authentication: Public browser navigation; configured GitHub OAuth app.

### Request

```
Navigate using the sign-in button. No request body.
```

### Response

```
Redirects to GitHub authorization with browser-bound state and S256 PKCE; configuration errors redirect to /?auth_error=….
```

## GET /api/auth/github/callback

Complete GitHub sign-in

Authentication: Valid one-use state and initiating browser cookie.

### Request

```
GitHub supplies code and state, or an authorization error.
```

### Response

```
Issues the studio session and redirects home on success. Errors redirect to /?auth_error=….
```

This is an OAuth callback, not an endpoint to call manually. Existing email/password accounts are not automatically linked by email.

## GET /api/auth/github/status

Read your GitHub connection

Authentication: Account browser session only.

### Request

```
No body.
```

### Response

```
{ enabled: boolean, connected: boolean, login: string | null }
```

## POST /api/auth/github/link

Connect GitHub to your existing account

Authentication: Account browser session; matching Origin.

### Request

```
No body.
```

### Response

```
{ url }; navigate to the returned GitHub authorization URL.
```

The callback must complete in the same signed-in session. A GitHub identity already linked to another account is rejected.

## POST /api/auth/logout

End a browser session

Authentication: Session; matching Origin for cookie authentication.

### Request

```
No body.
```

### Response

```
{ "ok": true }; clears the session cookie.
```

Logging out of a browser does not revoke API keys.

## GET /api/projects

Search and list projects

Authentication: Session or Bearer token.

### Request

```
Query: q (name/description), kind (web|slides|report|wireframe|3d|video), sort (updated|created|name).
```

### Response

```
{ projects: ProjectSummary[] }; up to 500 owned projects. Summaries exclude document.
```

## POST /api/projects

Create or clone a project

Authentication: Session or Bearer token.

### Request

```
{ "name": "Product story", "kind": "slides", "templateId": "product-deck" }
```

### Response

```
201 { project: Project }; initial revision is 1.
```

Optional description, themeId, templateId, document. Supplying an owned document creates a new project and copies owned asset bytes; there is no separate REST clone route.

## GET /api/projects/:id

Read a project and revision

Authentication: Session or Bearer token; project owner.

### Request

```
Replace :id with an actual project ID.
```

### Response

```
{ project: { id, name, description, kind, document, revision, createdAt, updatedAt, publishedUrl? } }
```

## PATCH /api/projects/:id

Update project metadata

Authentication: Session or Bearer token; project owner.

### Request

```
{ "name": "Updated name", "description": "Updated description" }
```

### Response

```
{ project: Project }; increments revision.
```

Both fields are optional. This metadata route checks the revision read by the server; use document PUT or CLI rename for an explicit client expectedRevision.

## PUT /api/projects/:id/document

Save the canonical document

Authentication: Session or Bearer token; project owner.

### Request

```
{ "document": "<complete DesignDocument object>", "expectedRevision": 1 }
```

### Response

```
{ project: Project }; revision increments atomically. A stale expectedRevision returns 409.
```

document is an object, not a string: replace the illustrative placeholder. Preserve project ID/kind. Owned asset references must belong to this project. Targeted patch operations are available through CLI/MCP, which reuse this save contract.

## POST /api/projects/:id/merge

Merge concurrent human and agent edits

Authentication: Session or Bearer token; project owner.

### Request

```
{ baseRevision, base, document }; base is the complete document originally read, document is your edited copy.
```

### Response

```
{ project: Project }; saves the reconciled document. Overlapping edits return 409 with error.code merge_conflict and error.details.paths.
```

baseRevision is the positive project revision originally read, separate from the brief revision. Preserve the exact base and project ID/kind. Never alter the base or invent its revision to force a merge; resolve overlapping changes explicitly.

## GET /api/projects/:id/changes

Observe the saved project revision

Authentication: Session or Bearer token; project owner.

### Request

```
Optional query: since, the last observed nonnegative project revision; default 0.
```

### Response

```
{ revision, unchanged: true } when since equals the saved revision; otherwise { revision, project: Project }.
```

Returns the current saved project when changed, not a history or operation log. Does not include unsaved browser edits.

## DELETE /api/projects/:id

Delete a project

Authentication: Session or Bearer token; project owner.

### Request

```
No body.
```

### Response

```
{ "ok": true }
```

Deletes the project, stored assets, and publications. This is destructive.

## GET /api/projects/:id/checks

Inspect the saved design

Authentication: Session or Bearer token; project owner.

### Request

```
No body.
```

### Response

```
{ projectId, revision, issues, counts: { warnings, information, total }, truncated, limitations }
```

Read-only deterministic preflight with node/page IDs and suggestions. Estimates bounds, text fit, opaque-hex contrast, missing/remote media, chart data, and duration limits. Does not certify accessibility or visual quality; inspect the actual preview.

## GET /api/projects/:id/brief

Read the design brief and scope

Authentication: Session or Bearer token; project owner.

### Request

```
No body.
```

### Response

```
{ brief: DesignBrief | null }
```

A brief has its own revision, separate from the document revision, plus request, status, message, questions, answers, scope, approvedAt, and updatedAt.

## PUT /api/projects/:id/brief

Save a brief, interview, answers, or scope

Authentication: Session or Bearer token; project owner.

### Request

```
{ "expectedRevision": 0, "request": "Create a six-slide introduction for our team." }
```

### Response

```
{ brief: DesignBrief }; increments the brief revision. Stale revisions return 409.
```

Revision 0 creates a brief and requires request. Supply at least one of request, interview, answers, or scope. Read interview/scope JSON Schemas at /api/schema. Answers map question IDs to text or multiple-choice arrays. Every edit invalidates prior approval. External agents can supply their own interview and scope without server BYOK.

## POST /api/projects/:id/brief/interview

Generate contextual interview questions or scope

Authentication: Session or Bearer token; project owner.

### Request

```
{ "expectedRevision": 1, "provider": "openai" }
```

### Response

```
{ brief: DesignBrief }; saves the validated provider response with revision protection.
```

Requires an existing brief and configured text-provider BYOK; charges may apply. Providers: openai, anthropic, gemini, openrouter, deepseek, custom-<slug>; model is optional. Returns up to eight contextual questions or a concrete scope. Invalid provider responses leave the saved brief unchanged.

## POST /api/projects/:id/brief/approve

Approve the current scope

Authentication: Session or Bearer token; project owner.

### Request

```
{ "expectedRevision": 2 }
```

### Response

```
{ brief: DesignBrief }; status becomes approved and approvedAt is recorded.
```

Requires a scope and answers to all required questions. Obtain explicit human approval of the current scope before calling. Approval increments the brief revision; it does not generate a design, save the document, or publish.

## GET /api/projects/:id/assets

List project assets

Authentication: Session or Bearer token; project owner.

### Request

```
No body.
```

### Response

```
{ assets: [{ id, name, type, mimeType, url, size }] }
```

## POST /api/projects/:id/assets

Upload private media

Authentication: Session or Bearer token; project owner.

### Request

```
multipart/form-data with a file field. Let your HTTP client set the multipart boundary.
```

### Response

```
{ asset: { id, name, type, mimeType, url, size } }
```

Maximum 20 MB. PNG/JPEG/WebP/GIF, MP3/WAV/OGG, MP4/WebM, and GLB are supported with signature validation. Upload does not place a node on the canvas.

## GET /api/assets/:id

Download private asset bytes

Authentication: Session or Bearer token; asset owner.

### Request

```
Replace :id with an actual asset ID.
```

### Response

```
Binary response with the stored MIME type.
```

## GET /api/projects/:id/messages

Read saved conversation

Authentication: Session or Bearer token; project owner.

### Request

```
No body.
```

### Response

```
{ messages: [{ id, role, text, createdAt }] }; latest 200 messages in chronological order.
```

## POST /api/projects/:id/messages

Append a conversation message

Authentication: Session or Bearer token; project owner.

### Request

```
{ "role": "user", "text": "Make the title more concise." }
```

### Response

```
201 { message: { id, role, text, createdAt } }
```

role is user or assistant; text is 1–30,000 characters. This stores a message; it does not invoke a provider.

## POST /api/projects/:id/generate

Generate a design proposal

Authentication: Session or Bearer token; project owner.

### Request

```
{ "provider": "openai", "prompt": "Make the opening slide more spacious.", "expectedRevision": 1 }
```

### Response

```
{ document: DesignDocument, usage? }
```

Optional model. Providers: openai, anthropic, gemini, openrouter, deepseek, custom-<slug>. Requires configured BYOK, may incur charges, and does not save. Prompt maximum 12,000 characters. Inspect, then save with the original revision.

## POST /api/projects/:id/media

Generate or transform media

Authentication: Session or Bearer token; project owner.

### Request

```
{ "provider": "fal", "kind": "audio", "prompt": "Warm ambient instrumental music", "durationSeconds": 30 }
```

### Response

```
OpenAI, Gemini, Grok, custom: { asset }. fal and Leonardo: 202 { job: { id, status: "queued" } }.
```

kind: image|audio|video. Optional model, voice, sourceAssetId, durationSeconds, strength. Sources must belong to this project. OpenAI image/edit/speech; Gemini, Grok and Leonardo prompt-only images; custom OpenAI/Gemini compatible prompt-only images; fal image/edit, video/edit, music/effects/audio transformation. Requires BYOK and can incur charges.

## GET /api/projects/:id/media/:jobId

Poll a media job

Authentication: Session or Bearer token; project owner.

### Request

```
Use the project ID and returned job ID.
```

### Response

```
{ status: "queued" | "processing" } or { status: "completed", asset }.
```

Supports all fal media kinds. A completed result is reused on later polls. Failures return actionable errors; queued is not completed.

## POST /api/projects/:id/export

Download a rendered file

Authentication: Session or Bearer token; project owner.

### Request

```
{ "format": "png", "pageIndex": 0, "expectedRevision": 1 }
```

### Response

```
File bytes with Content-Type and Content-Disposition. No JSON success envelope.
```

Formats: json, html, svg, png, pdf, pptx, webm, mp4, react, glb, gltf. React returns a runnable frontend ZIP for Web/App or wireframe projects. GLB/glTF export the selected scene with geometry/materials/animation. pageIndex defaults to 0; expectedRevision is optional. PDF/PPTX include all pages. Import remote media before isolated cloud rendering. React source export does not require Chromium; GLB/glTF and raster/video formats use the configured browser renderer. Size and encoder limits apply.

## POST /api/projects/:id/google-slides

Create Google Slides

Authentication: Session or Bearer token; project owner.

### Request

```
{ "accessToken": "<short-lived Google OAuth access token>" }
```

### Response

```
{ url, presentationId }
```

Requires real Google authorization. Native text/shapes/HTTPS images are supported; unsupported complex nodes and private image URLs fail explicitly. Do not put the token in source files.

## POST /api/projects/:id/publish

Publish an immutable snapshot

Authentication: Session or Bearer token; project owner.

### Request

```
No body.
```

### Response

```
{ url, revision }
```

Makes this saved design and its referenced snapshot assets public. Later private edits do not change it.

## DELETE /api/projects/:id/publish

Unpublish a project

Authentication: Session or Bearer token; project owner.

### Request

```
No body.
```

### Response

```
{ "ok": true }; removes all public snapshots of this project.
```

## POST /api/projects/:id/preview

Create a public preview link

Authentication: Session or Bearer token; project owner.

### Request

```
No body.
```

### Response

```
{ url, revision }
```

Creates the same immutable public snapshot as publish, under the preview naming used by agents. Later private edits do not change it.

## DELETE /api/projects/:id/preview

Remove preview links

Authentication: Session or Bearer token; project owner.

### Request

```
No body.
```

### Response

```
{ "ok": true }; removes all public snapshots of this project.
```

## POST /api/projects/:id/share

Create a public share link

Authentication: Session or Bearer token; project owner.

### Request

```
No body.
```

### Response

```
{ url, revision }
```

Creates the same immutable public snapshot as publish, under the share naming used by agents.

## DELETE /api/projects/:id/share

Remove share links

Authentication: Session or Bearer token; project owner.

### Request

```
No body.
```

### Response

```
{ "ok": true }; removes all public snapshots of this project.
```

## GET /published/:slug

View a published snapshot

Authentication: Public.

### Request

```
Use the slug from a publish response.
```

### Response

```
HTML snapshot, including the trusted 3D/timeline viewer where applicable.
```

## GET /published/:slug/assets/:id

Read a snapshot asset

Authentication: Public, scoped to this snapshot.

### Request

```
Use the snapshot asset URL. Private API asset URLs do not become public.
```

### Response

```
Asset bytes only when this publication references the asset.
```

## GET /api/providers

List masked provider settings

Authentication: Account session or API key.

### Request

```
No body.
```

### Response

```
{ providers: [{ provider, name, baseUrl, model, protocol, authMethod, authHeader, configured, apiKey: "••••••••" }] }
```

API-key MCP clients can use list_provider_connections for these masked IDs. MCP OAuth tokens cannot access provider settings.

## PUT /api/providers/:provider

Save a BYOK connection

Authentication: Account session or API key.

### Request

```
{ "apiKey": "<provider secret from secure input>", "model": "<optional model ID>" }
```

### Response

```
{ provider, name, baseUrl, model, protocol, authMethod, authHeader, configured: true, apiKey: "••••••••" }
```

Providers: openai, anthropic, gemini, openrouter, fal, deepseek, leonardo, grok or custom-<slug>. Custom connections require name, baseUrl and model; protocol is openai, anthropic or gemini. authMethod: bearer, api-key (authHeader), basic (username:password credential), none. HTTPS origins must be operator-allowlisted. Omit apiKey to retain it; endpoint/auth changes require a new credential. Secrets are encrypted. Prefer CLI --key-env or --key-stdin; ChatGPT subscriptions do not include OpenAI API access.

## DELETE /api/providers/:provider

Remove a BYOK connection

Authentication: Account session or API key.

### Request

```
No body.
```

### Response

```
{ "ok": true }
```

## GET /api/tokens

List API-key metadata

Authentication: Account session or API key.

### Request

```
No body.
```

### Response

```
{ tokens: [{ id, name, createdAt, lastUsedAt }] }
```

Raw keys are never returned by list. MCP OAuth cannot manage permanent credentials.

## POST /api/tokens

Create an API key

Authentication: Account session or API key.

### Request

```
{ "name": "Local design agent" }
```

### Response

```
201 { id, token }; raw token is returned once.
```

Treat this response as a secret. Use the signed-in key-management UI to create your first key.

## DELETE /api/tokens/:id

Revoke an API key

Authentication: Account session or API key.

### Request

```
Use the key ID from the metadata list, not the secret value.
```

### Response

```
{ "ok": true }; revoked keys no longer authenticate.
```

## Errors and concurrency

Application errors use {error:{code,message,details?}}. OAuth errors use {error,error_description}. Handle 400 invalid input, 401 authentication, 403 origin/scope, 404 unavailable ownership-scoped resources, 409 revision conflicts, 413 byte/pixel limits, 429 rate limits, and 502/503 upstream/configuration failures. Read and reconcile on a revision conflict; never blindly raise expectedRevision.

---

Source: https://beta.studio.agentkit.best/docs/cli

# CLI commands

> A stateless, scriptable interface built for your agent workflow.

**CLI release and source reference** The command reference below follows the current source. The v0.3.0 release includes the observability commands and current design-kind skill references. Check installed command help before automation. To build from source, run `npm ci`, `npm ci --prefix packages/cli`, and `npm run build:cli`, then `node packages/cli/dist/dsa.js --help`.

`dsa` is a standalone Node 24+ CLI with bundled validation, templates, and static rendering. It prints JSON by default and writes actionable errors to stderr. It stores no configuration, login session, or credentials.

```
npm install -g https://github.com/bestagentkits/design-studio-ai/releases/download/v0.3.0/bestagentkits-design-studio-ai-0.3.0.tgz
dsa --help
dsa projects export --help
dsa media generate --help
```

**Secrets stay outside command history** Inject `DESIGN_STUDIO_API_KEY` and optionally `DESIGN_STUDIO_URL`. Global flags are `--url`, `--api-key`, `--timeout` (milliseconds, default 180000), and `--json`. Prefer environment injection to typing a key as a flag. HTTP is allowed only for loopback development.

## Command reference

All commands below begin with `dsa`. Options without “required” are optional. Use command `--help` for the installed version. Document/operation input accepts `--file -` for stdin; prompt input accepts `--prompt-file -`.

| Command | Options | Behavior |
| --- | --- | --- |
| observability summary | --scope owner\|all --days N --project-id ID --actor-id ID --channel NAME --kind NAME --status NAME --action ACTION | Read activity/usage/coverage. All-account scope requires configured operator; actor filter only in all scope. |
| observability events | Summary filters plus --limit N --cursor CURSOR | Read safe paginated activity events. |
| observability trace ID | --scope owner\|all --days N | Read correlated request steps within 1–30 days; default7. |
| health · config | No required options | Read public health/configuration; never persist credentials. |
| schema | --operations | Print document JSON Schema or targeted-operation schema. |
| catalog | No options | List bundled themes, templates, and blocks. |
| themes list · get ID | No required options | Inspect design tokens and palettes. |
| templates list · get ID | list: --kind KIND | Inspect supported starters. |
| templates instantiate ID | --name NAME --theme ID --output FILE | Create a local document with fresh IDs; no server write. |
| blocks list · get ID | get: --offset PIXELS | Inspect reusable node groups. |
| design-systems schema · list | No required options | Discover the shared definition schema or your saved libraries. |
| design-systems get ID | --system-version N | Read the latest or an immutable saved version. |
| design-systems versions ID | No required options | List saved library versions. |
| design-systems create | --file FILE required | Create a library from a validated definition; accepts stdin with --file -. |
| design-systems update ID | --system-version N --file FILE required | Append a version using the version of the definition actually read; conflicts require reconciliation. |
| design-systems apply ID PROJECT_ID | --revision N required; --system-version N | Apply saved tokens/system to an owned project and pin the selected library version. |
| design-systems insert ID PROJECT_ID | --revision N --page PAGE_ID --item ITEM_ID required; --system-version N | Insert a saved component or composition into a project. |
| design-systems remove ID | No required options | Delete the library and history; existing project designs remain intact. |
| fonts | --query TEXT | Search Google font families/categories; inspect source for live/cache/fallback provenance. |
| providers models ID | --query TEXT | Search the saved connection model catalog; custom endpoints retain manual IDs and labeled suggestions. |
| projects list | --query TEXT --kind KIND --sort updated\|created\|name | Search persisted owned projects. |
| projects check ID | No required options | Inspect saved design bounds, text fit, estimated contrast, media, and export limitations; never an accessibility certification. |
| projects get ID | No required options | Read document and saved revision. |
| projects create | --name NAME required; --description TEXT --kind KIND --template ID --theme ID --file FILE --input-format auto\|json\|yaml | Create a persisted project. Choose --file (JSON or YAML) or --template. |
| projects rename ID NAME | --revision N required | Rename with an explicit observed revision. |
| projects clone ID | --name NAME | Create an independent project, copying owned media bytes. |
| projects delete ID | No required options | Delete project, assets, and publications. |
| brief get ID | No required options | Read the persisted interview, answers, scope, and independent brief revision. |
| brief put ID | --revision N --file FILE required | Save request/interview/answers/scope; revision 0 creates. Input file excludes expectedRevision. Invalidates approval. |
| brief interview ID | --revision N --provider ID required; --model ID | Generate and persist contextual questions/scope using configured BYOK; charges may apply. |
| brief approve ID | --revision N required | Record explicit human approval of the current answered scope. Does not generate or publish. |
| projects document get ID | --output FILE | Read the canonical document. |
| projects document put ID | --file FILE --revision N required; --input-format auto\|json\|yaml | Save a complete validated document (JSON or YAML file) with atomic concurrency protection. |
| projects document patch ID | --file FILE --revision N required; --input-format auto\|json\|yaml | Apply a targeted operation array (JSON or YAML file) and save atomically. |
| projects document merge ID | --file FILE required | Merge JSON {base, document, baseRevision} against the exact document/revision originally read; overlapping edits require reconciliation. Accepts - for stdin. |
| projects document changes ID | --since N (default 0) | Read the current saved revision and project when changed, or unchanged: true at the observed revision. N must be nonnegative. |
| projects import | --file FILE required; --name NAME; --input-format auto\|json\|yaml | Create a new project from a canonical document in JSON or YAML. |
| projects export ID | --format FORMAT required; --output FILE / --out FILE --page INDEX --revision N | Download real server bytes, including react ZIP, glb and gltf. Binary formats require a file; glTF is JSON text. |
| render | --file FILE --format json\|html\|svg required; --input-format auto\|json\|yaml --output FILE --page INDEX --time SECONDS | Render a JSON or YAML document offline; preserves references without fetching private media. |
| assets list PROJECT_ID | No required options | List stored assets. |
| assets upload PROJECT_ID | --file FILE required; --mime TYPE | Upload media; placing it is a separate edit. |
| assets download ASSET_ID | --output FILE required | Download authenticated bytes to a file. |
| generate PROJECT_ID | --provider ID --revision N required; --prompt TEXT or --prompt-file FILE; --model ID --output FILE | Generate a proposal without saving; BYOK charges may apply. |
| providers list · remove ID | No required options | Read masked configurations or remove a connection. |
| providers set ID | --key-env VARIABLE or --key-stdin or --keep-key; --base-url URL --model ID; custom: --name NAME --protocol FORMAT --auth-method METHOD --auth-header HEADER | Otherwise reads PROVIDER_API_KEY, e.g. OPENAI_API_KEY. |
| tokens list · revoke ID | No required options | List metadata or revoke access. |
| tokens create | --name NAME required | Returns the newly created secret once. |
| publish · unpublish PROJECT_ID | No required options | Create a public snapshot or remove all project snapshots. |
| preview · unpreview PROJECT_ID | No required options | Create a public preview link or remove all project snapshots. |
| share · unshare PROJECT_ID | No required options | Create a public share link or remove all project snapshots. |
| media generate PROJECT_ID | --kind KIND --provider ID required; --prompt TEXT or --prompt-file FILE; --model ID --voice ID --source-asset ID --duration SECONDS --strength NUMBER | Generate/edit image, video, speech, music, or effects using compatible modes. |
| media status PROJECT_ID JOB_ID | No required options | Poll queued fal media or Leonardo images. |
| google-slides PROJECT_ID | --key-env VARIABLE or --key-stdin | Defaults to GOOGLE_ACCESS_TOKEN; creates a real supported presentation. |
| api METHOD /api/path | --file FILE | Same-origin REST escape hatch; no JSON body for GET/HEAD. |

## Files and exit codes

JSON is the default for metadata. Document/template/export content sent to stdout is raw. `--output` writes the file and returns metadata; binary exports require a filename. Exit codes:  **0**  success,  **1**  input/API/conflict,  **2**  authentication/authorization,  **3**  network/invalid response,  **4**  local file/runtime error.

```
dsa providers set openai --key-env OPENAI_API_KEY
dsa media generate PROJECT_ID --kind image --provider openai \
  --source-asset ASSET_ID --prompt-file edit.txt

dsa providers set fal --key-env FAL_API_KEY
dsa media generate PROJECT_ID --kind audio --provider fal \
  --duration 30 --prompt-file music.txt
dsa media status PROJECT_ID JOB_ID
```

Source type selects a compatible default model. `--strength` is for fal image/audio transformations, `--voice` for OpenAI speech. All fal modes and Leonardo images queue real jobs; poll to completion before claiming an asset exists. The package is distributed through GitHub Releases, not the npm registry.

[Command implementation](https://github.com/bestagentkits/design-studio-ai/blob/main/packages/cli/src/dsa.ts)

---

Source: https://beta.studio.agentkit.best/docs/mcp

# Network MCP

> Connect remote agents through Streamable HTTP and OAuth.

## Project connectors and tool-assisted design

In Settings, connect MCP, GitHub or Google Drive. In the editor, select project tools and source files, import snapshots, and grant each agent its own access. A connected account alone grants no agent authority. Tool-assisted design runs checkpoint each model/tool step, pause for exact human approval, and return a proposal for review before saving.

GitHub source files are pinned to a commit. React exports prepare a downloadable ZIP and file diff before creating a new branch and PR. Drive exports prepare real PDF/PPTX files or supported native Slides. Inspect partial remote IDs; uncertain writes are never replayed automatically. The reconciliation operation only checks an existing GitHub PR or Drive upload.

Use `dsa connectors --help` and `dsa connectors schema start-agent-run` with the current CLI build. Network MCP and WebMCP expose the same selected source, operation and run contracts. Setup, grants and approval remain human actions. Released older CLI packages may not include these experimental commands.

Connect a remote MCP client to the studio. Network tools work on persisted projects using your API key or an OAuth access token; they do not require an open editor tab.

Streamable HTTP endpoint `https://beta.studio.agentkit.best/mcp`Authenticated · POST

## Connect with an API key

In your client's remote-server configuration, choose HTTP/Streamable HTTP, enter the endpoint above, and configure `Authorization: Bearer` using your secure token input. Client configuration-file formats and environment interpolation vary; these are the connection parameters, not a universal import file.

```
URL: https://beta.studio.agentkit.best/mcp
Transport: Streamable HTTP
Authorization: Bearer <securely supplied DESIGN_STUDIO_API_KEY>
Protocol: 2025-11-25
```

```
curl "$DESIGN_STUDIO_URL/mcp" \
  -H "Authorization: Bearer $DESIGN_STUDIO_API_KEY" \
  -H "Content-Type: application/json" \
  -H "Accept: application/json, text/event-stream" \
  -H "MCP-Protocol-Version: 2025-11-25" \
  --data '{"jsonrpc":"2.0","id":1,"method":"initialize","params":{"protocolVersion":"2025-11-25","capabilities":{},"clientInfo":{"name":"my-design-agent","version":"1.0.0"}}}'
```

Use `get_design_brief` and `update_design_brief` to interview the human with your own agent model. `interview_design_brief` instead invokes the owner's configured BYOK provider. `approve_design_brief` requires explicit human approval of the current answered scope and its independent brief revision. `inspect_design` reads deterministic preflight findings; it is not a visual-quality certification.

## Connect with OAuth

- Use the same remote URL and choose OAuth in a compatible client.
- The client discovers the protected resource and authorization server, registers its redirect URI, and requests the `studio` scope.
- Sign in to the studio and approve consent in the browser. Consent requires your account session.
- The client exchanges the one-use code with S256 PKCE for access/refresh tokens, bound to the canonical `/mcp` resource.

| Method | OAuth path | Purpose |
| --- | --- | --- |
| GET | /.well-known/oauth-protected-resource | Resource and authorization-server discovery |
| GET | /.well-known/oauth-protected-resource/mcp | Path-specific resource discovery |
| GET | /.well-known/oauth-authorization-server | Endpoints, grant types, PKCE, scope |
| POST | /oauth/register | JSON client_name and redirect_uris; returns client_id |
| GET / POST | /oauth/authorize | Browser consent; exact redirect, state, S256 challenge, resource |
| POST | /oauth/token | Form-encoded authorization_code or refresh_token grant |
| POST | /oauth/revoke | Form-encoded token and client_id; revokes its token family |

Use HTTPS redirects or HTTP loopback for local clients. Resource must equal the canonical MCP endpoint. Access tokens last one hour; refresh tokens rotate. OAuth tokens cannot create/manage permanent API keys or provider credentials. GET event streams and protocol sessions are not used. The endpoint serves the stateless `2026-07-28` revision (per-request `_meta`, `MCP-Protocol-Version`/`Mcp-Method`/`Mcp-Name` headers and `server/discover`) alongside `initialize` clients on 2025-11-25, 2025-06-18 and 2025-03-26. An unsupported version returns HTTP 400 with JSON-RPC error `-32022` listing the supported versions. Hosted connectors such as ChatGPT use the same OAuth flow.

## Observe and reconcile human edits

Use `get_design_changes` to observe saved revisions. Keep the exact document and revision you read as the base for `merge_design`; independent edits can merge, while overlapping changes return conflict paths. Resolve those changes explicitly. Never alter the base or invent a revision to bypass a conflict.

## Discover tools and resources

Call `tools/list` to get the live input schemas. Arguments whose schema is too large for hosted discovery, such as complete documents and operation lists, are listed as a typed placeholder whose description points to `get_tool_schema`; the server still validates them against the complete shared schema. Call `get_tool_schema` with a tool name and optional argument to read that complete JSON Schema. A schema larger than 16 KB is returned as an outline whose large parts carry a `$pointer`; pass that value as `pointer` to read one part, such as a single patch operation. Tool names below are implemented; their descriptions identify reads, writes, publication, and potentially paid provider calls.

### Projects

`list_projects``get_project``create_project``update_document``patch_document``delete_project`

### Collaboration

`get_design_changes``merge_design`

### Brief and scope

`get_design_brief``update_design_brief``interview_design_brief``approve_design_brief`

### Design resources

`inspect_design``list_themes``list_templates``list_components``apply_theme`

### Design-system libraries

`list_design_systems``get_design_system``list_design_system_versions``create_design_system``update_design_system``apply_design_system``insert_design_system_item``delete_design_system`

### Discovery

`get_tool_schema``list_google_fonts``list_provider_models`

### Assets and delivery

`upload_asset``list_assets``preview_project``unpreview_project``share_project``unshare_project``publish_project``unpublish_project``export_project`

### Generation

`generate_design``generate_media``get_media_job`

```
curl "$DESIGN_STUDIO_URL/mcp" \
  -H "Authorization: Bearer $DESIGN_STUDIO_API_KEY" \
  -H "Content-Type: application/json" \
  -H "Accept: application/json, text/event-stream" \
  -H "MCP-Protocol-Version: 2025-11-25" \
  --data '{"jsonrpc":"2.0","id":2,"method":"tools/list","params":{}}'
```

Resources: `studio://schema`, `studio://operations`, and `studio://projects/{projectId}`. Writes such as `update_document`, `patch_document`, and `apply_theme` require `expectedRevision`. Library updates use expectedVersion; apply/insert use the observed project expectedRevision and an optional saved library version. Discovery query matches names/IDs/categories and reports live/cache/fallback provenance; provider model discovery requires an API key rather than MCP OAuth. React ZIP and GLB/glTF are returned as base64 resources by export_project, which also accepts optional expectedRevision. Binary MCP responses are limited to 20 MB; use CLI export for larger files.

## YAML authoring

`create_project` and `update_document` accept a `documentYaml` string and `patch_document` accepts `operationsYaml` as alternatives to `document` and `operations` (send one, not both). The YAML is parsed first as a single YAML 1.2 document without tags, anchors or aliases, then validated by the same schemas, so it saves what the equivalent JSON saves. Invalid or unsafe YAML returns an error and never changes the project; revision, ownership and asset checks are unchanged. Responses and storage remain JSON. YAML is not guaranteed to be smaller than compact JSON.

[Configure agent access](https://beta.studio.agentkit.best/?settings=agents)

---

Source: https://beta.studio.agentkit.best/docs/webmcp

# Browser WebMCP

> Let an in-browser agent work with the open, unsaved canvas.

EXPERIMENTAL BROWSER CAPABILITY WebMCP lets an in-browser agent work with the open editor, including its unsaved design. It is separate from the remote MCP server and uses the current signed-in browser session.

**Feature detection, not a browser requirement** The editor detects `document.modelContext`, with `navigator.modelContext` as a legacy fallback. Tools register only while an editor is open and are cleaned up when it changes or unmounts. Unsupported browsers retain the full workspace and network MCP.

## Open-document tools

| Tool | Input | Effect |
| --- | --- | --- |
| studio_get_brief | {} | Read the saved interview, answers, scope, and independent brief revision. |
| studio_update_brief | { expectedRevision, request?, interview?, answers?, scope? } | Persist a brief update, with revision zero for creation. Invalidates approval and opens the interview workspace. |
| studio_approve_brief | { expectedRevision } | Approve the current answered scope only after explicit human agreement. Does not generate or publish. |
| studio_inspect_design | {} | Read preflight hints for the current unsaved document. Does not change or save it; does not certify accessibility. |
| studio_get_design | {} | Read the current unsaved document and saved revision. |
| studio_update_node | { nodeId, patch } | Edit one existing node locally. Patch permits text, x, y, width, height, opacity, and rotation. Edits locally; live mode autosaves. |
| studio_set_design | { document } | Replace the local document after full validation. Keep the open project's ID and kind. Edits locally; live mode autosaves. |
| studio_save_design | {} | Save the current local document using the saved revision. Conflicts do not silently overwrite newer work. |

## Shared operations and authenticated API tools

`studio_apply_operations` accepts the shared operation schema for structured layouts, components, pages, meshes and timelines. `studio_capabilities` returns current schemas and documented endpoints. Tools named `studio_api_…` operate on saved server state, including library CRUD/version/apply/insert, discovery, export and asset upload.

Pass path values in `parameters`, URL filters or pinned versions in `query`, and write payloads in `body`. For the asset-upload tool, pass `{ name, mimeType, base64 }` as body; it creates the real multipart file request. Uploading does not place a node. Server ownership and revision checks still apply.

```
{ "query": { "q": "Roboto" } }
```

Discover exact tool names and request schemas from the browser registry or [live OpenAPI reference](https://beta.studio.agentkit.best/api/openapi); registration follows the documented API surface.

```
{
  "nodeId": "ACTUAL_NODE_ID",
  "patch": { "text": "A clearer headline", "x": 64 }
}
```

Read first, apply focused edits, and inspect the canvas. Save explicitly when live autosave is off; API tools always operate on saved server state. A browser agent does not receive provider secrets or permanent API keys through these tools. Check Settings → Agent access for the browser capability state.

[Open the editor](https://beta.studio.agentkit.best/)[Check agent connections](https://beta.studio.agentkit.best/?settings=agents)

---

Source: https://beta.studio.agentkit.best/docs/api-keys

# API keys & access

> Create, inject, and revoke credentials for your own workspace.

## One key for your agent's workspace.

Create a named key in your signed-in account. Give each agent or environment its own key so you can revoke it independently.

[Open API-key management](https://beta.studio.agentkit.best/?settings=agents)

- Open Settings → Agent access and create a key with a recognizable name.
- Copy the secret when shown. The list keeps metadata, not retrievable raw keys.
- Store it in your agent's secret manager or environment as `DESIGN_STUDIO_API_KEY`.
- Use the key ID to revoke it from Settings, CLI, or REST when access is no longer needed.

```
# DESIGN_STUDIO_API_KEY is supplied by your environment.
dsa tokens list
dsa tokens revoke TOKEN_ID
```

## Know which credential you are using

| Credential | Purpose | Management |
| --- | --- | --- |
| Application API key | Agent access to your studio account and projects. | Settings → Agent access; named, hashed at rest, revocable. |
| Provider BYOK key | Authorize paid text/image/audio/video calls to your provider. | Settings → provider connections; encrypted at rest, masked on reads. |
| MCP OAuth token | Scoped client authorization to project workflows. | OAuth consent/refresh/revocation; cannot manage permanent credentials. |
| Browser session | Signed-in human UI and browser WebMCP. | HttpOnly cookie; cookie writes check the trusted Origin. |

**Try authenticated requests in the REST playground** The REST playground can use a key held only in page memory, or your signed-in session. Executing a write changes the selected project. Clear the key after use. Never paste them into design prompts, public documents, source control, or published snapshots.

---

Source: https://beta.studio.agentkit.best/docs/observability

# Activity & usage

> Trace actions, investigate errors, and inspect measured provider usage.

Open [Activity & usage](https://beta.studio.agentkit.best/activity) to inspect your account’s request log, provider measurements and correlated traces. Templates and design systems have stable links at [/templates](https://beta.studio.agentkit.best/templates) and [/design-systems](https://beta.studio.agentkit.best/design-systems); opening these pages does not create or modify a project.

## Find a failed action

- Choose a period, channel, operation kind or status. Project IDs narrow the view to a saved design.
- Open a trace from the log, or paste the request ID shown in an API error. Instrumented responses return `X-Request-ID`.
- Inspect HTTP, MCP tool, provider and export steps. A provider success can be followed by a document validation failure; reported usage remains visible.
- Fix the diagnostic code or conflict before retrying. A running operation is different from a recently active account. Stale operations become interrupted/unknown.

## Usage without invented numbers

Input/output tokens and USD costs come from explicit provider response fields. “Not reported” means unavailable, not zero. Coverage shows how many calls have measurements; sums may be partial. Media polling does not count as another generation. Latency and failure rates help identify slow or unreliable actions; they do not measure design quality.

## Agent access

```
dsa observability summary --days 7
dsa observability events --status error --limit 25
dsa observability trace REQUEST_ID --days 30
```

REST uses `GET /api/observability/summary`, `GET /api/observability/events`, and `GET /api/observability/trace/:id`. Network MCP tools are `get_observability_summary`, `list_activity_events`, and `get_activity_trace`. Browser WebMCP exposes `studio_api_get_observability_summary`, `studio_api_get_observability_events`, and `studio_api_get_observability_trace_id`. All use the same server authorization.

## Privacy and operator access

The default `scope=owner` shows your account. All-account inspection requires an account ID explicitly listed in server `OBSERVABILITY_ADMIN_IDS` plus session or API-key authentication. MCP OAuth cannot use `scope=all`. Logs retain safe metadata for 30 days; they exclude prompts, design text, raw exception messages, credentials and arbitrary URLs.

## PostHog and coverage

First-party browser events use the strict schema on `POST /api/observability/client-events`. Optional PostHog forwarding requires `POSTHOG_PROJECT_KEY` and the project’s verified `POSTHOG_HOST`. Cloud hosts are `https://us.i.posthog.com` and `https://eu.i.posthog.com`. No DOM autocapture, session replay or email identification is enabled. This follows the [PostHog capture API](https://posthog.com/docs/api/capture).

Coverage reports storage state, dropped writes and PostHog delivery failures. Runtime health counters reset when an instance restarts and do not represent a global durable outage history. Tracking failure never retries a billed design operation.

## Editor controls

Shift-click canvas objects or layers to build a selection. Use the editor’s keyboard-shortcut help for select all, duplicate, grouping, undo/redo, delete and coarse/fine nudging. Text editing preserves canvas typography; font search previews the visible families. Install the complete `skills/design-studio-ai` directory, including its design-kind references, so agents use the matching layout and quality guidance.

---

Source: https://beta.studio.agentkit.best/docs/self-hosting

# Self-hosting & resources

> Run the same studio on your own infrastructure.

The same API runs on Cloudflare D1/R2 with Browser Rendering, or on Node 24+ with SQLite, files, and Chromium. Use the public studio or deploy your own copy under the MIT license.

```
npm ci
npm ci --prefix packages/cli
npm run build:cli
npx playwright install chromium
npm run build

# Set a stable 32-byte base64 ENCRYPTION_KEY and APP_URL
# in the server process environment before starting.
npm start
```

Node does not automatically load dotenv files. Keep the encryption key stable across restarts to retain access to encrypted provider keys. Set `APP_URL` to the canonical external origin and preserve `DATA_DIR` with its database and assets.

```
# Supply ENCRYPTION_KEY and APP_URL in the Compose environment.
docker compose up --build -d
docker compose logs --tail=100 studio
```

The container binds to `0.0.0.0:8787`; Compose persists `/data` in a named volume. Use HTTPS at a reverse proxy for public hosting. Cloudflare operators provision their own D1/R2/browser bindings, apply migrations, and set secrets before deploying.

## Export boundaries

- Import remote media before cloud binary export; the renderer has no external network access.
- Rendering is bounded by bytes and pixels: 16 megapixels per checked object/page and 64 megapixels per workload.
- WebM records actual motion; MP4 requires a supported encoder. Cloud motion is limited to 60 seconds and mixes imported audio/video; browser fallback is silent.
- SVG is static. HTML may include the trusted interactive viewer. PPTX preserves legacy editable text/primitives and rasterizes structured layouts/components. React exports runnable frontend source with the document, component runtime and embedded media; GLB/glTF export scene geometry, materials, skinning and sampled animation.
- Selected Google Fonts are fetched from official font hosts with byte/time limits and embedded before isolated rendering. Local fonts need no font request; unavailable selected Google fonts return an explicit export error.
- Google Slides supports native text/shapes/HTTPS images; unsupported complex/private-image content fails explicitly.
- Provider and Google success require your credentials and account access. Browser WebMCP remains experimental.

[Deployment, secrets & backups](https://github.com/bestagentkits/design-studio-ai/blob/main/docs/deployment.md)[BYOK model capabilities](https://github.com/bestagentkits/design-studio-ai/blob/main/docs/providers.md)[CLI and skill release](https://github.com/bestagentkits/design-studio-ai/releases/tag/v0.3.0)[MIT license](https://github.com/bestagentkits/design-studio-ai/blob/main/LICENSE)

Dependency audit findings and their runtime boundaries are disclosed in the deployment guide. Successful rendering tests do not mean the dependency tree is audit-clean.

---

Source: https://beta.studio.agentkit.best/guide

# Your first idea, made visible.

You bring the intent. Your agent helps with the design. A few thoughtful steps turn the conversation into something you can use.

[Let's make something](https://beta.studio.agentkit.best/guide#start)Describe it Refine it Share it

A little more room
for a good idea.

Start with what
you want to say.

[0 1 Choose a starting point](https://beta.studio.agentkit.best/guide#start)[0 2 Describe the outcome](https://beta.studio.agentkit.best/guide#brief)[0 3 Refine through conversation](https://beta.studio.agentkit.best/guide#conversation)[0 4 Make it yours](https://beta.studio.agentkit.best/guide#preview)[0 5 Export or share](https://beta.studio.agentkit.best/guide#deliver)[0 6 Connect an agent](https://beta.studio.agentkit.best/guide#agents)

01

BEGIN WITH A CANVAS

## Choose a starting point.

Open the studio and sign in. Write your idea on the homepage and choose Let’s create to save a project and begin its design interview. You can also start from a template when its structure suits your idea, or choose a blank project. Websites, slides, reports, wireframes, 3D scenes, and videos share the same editable workspace.

**No provider key needed to explore.** Templates and manual edits work on their own. Add your own AI-provider connection in Settings when you're ready to generate a design or media.

Design Studio AI

![The Design Studio project library and template choices on a desktop screen](https://beta.studio.agentkit.best/guide/assets/home-desktop.png)

Choose the kind of work you want to make, then open a starter or a blank project.

02

MAKE THE BRIEF USEFUL

## Describe the outcome, not every pixel.

A useful brief explains who this is for, what they should understand or do, what content is real, and how the design should feel. Give the agent your constraints before asking it to fill the canvas.

WHO

### Who is looking?

A first-time visitor, a customer, your team, or an investor?

WHAT

### What should happen?

Understand an idea, compare options, book a class, or take a next step?

WITHIN

### What must stay true?

Your approved copy, actual data, brand, dimensions, deadline, and assets.

STARTER BRIEF

Create a calm, welcoming landing page for a neighborhood ceramics studio. Help beginners understand the classes and book their first workshop. Use warm ivory, clay accents, large readable type, and generous spacing. Include a short introduction, three class options, and a clear booking button. Start with a desktop layout, then check it at a smaller viewport.

Adapt the details to your real project.

If you're unsure, ask the agent to interview you first: “Ask me the few questions you need to clarify the audience, scope, content, and success criteria.” The studio saves your brief, questions, answers, and scope so you or a connected agent can continue later.

03

WORK THROUGH THE CONVERSATION

## Agree on the scope. Then make the first draft.

Choose Ask AI to start the interview with a configured text provider. Answer the contextual questions, choose Save answers, and Continue interview until the direction is clear. If you prefer another agent, choose Use your own agent; you can also Write scope manually.

**Make approval a deliberate step.** Review Objective, Audience, Visual direction, Deliverables, Constraints, and Acceptance criteria. Use Save scope, then Approve scope. Editing the brief again requires fresh approval. The separate Generate design action creates and saves the first validated draft; it does not publish.

You can Open editor to work manually while the brief remains unapproved. Reload latest brief picks up changes from an external agent. Once a draft exists, use project chat for focused refinements, then review a proposal before applying and saving it.

EXAMPLE REFINEMENT REQUESTS

You Keep the layout. Make the headline shorter and give the introduction more breathing room.

You Use the same type scale on every slide. Keep the approved product copy unchanged.

You Before we add another section, tell me whether it helps the visitor book a class.

Ask for focused changes instead of starting over each time. Treat facts, figures, and product claims as your source material; ask the agent to request missing information rather than invent it.

**Generation uses your provider account.** Text, image, speech, music/effects, and video calls need compatible BYOK connections and may incur charges. Creating or editing media sends your selected source to that provider; it doesn't automatically publish the source.

04

KEEP YOUR HAND ON THE DESIGN

## Inspect it. Make it yours.

Select an object to refine its text, position, dimensions, color, or other supported properties. Use pages and layers to navigate a larger design, switch themes for a coherent starting palette, and save once the result feels right.

Design Studio AI

![The Design Studio editor showing the conversation panel, editable preview, and object inspector](https://beta.studio.agentkit.best/guide/assets/editor-desktop.png)

Conversation, preview, and manual controls stay close together so you can inspect a change before saving.

### A quick quality pass

Can you read every headline and body line at the intended size?

Do spacing, alignment, and typography feel consistent?

Are real images, data, and approved words preserved?

Does the main action stand out without competing messages?

Does the design still work at a smaller viewport?

For motion, are captions readable and timing intentional?

The design preflight can flag likely overflow, text fitting, estimated contrast, and missing media. Use these findings to guide inspection; automated checks do not certify accessibility or aesthetics.

Another person or agent may edit the same project. If saving reports a revision conflict, reload and reconcile the changes. Don't overwrite newer work blindly. In 3D, geometry/material/object rotation persist; orbit-camera changes are temporary preview state.

05

MAKE THE OUTPUT USEFUL

## Export the file. Share the right version.

Choose an output for the person who will use it. Open the exported file and check its contents. Save before exporting or publishing so you're delivering the revision you inspected.

### For a visual

PNG for a rendered page. SVG for supported static vector structure.

### For a document

PDF for pages. PowerPoint for editable text/shapes with complex content rasterized.

### For the web

HTML for a standalone design, including the trusted 3D/timeline viewer where supported.

### For motion

WebM for recorded timeline output. MP4 when the runtime has a supported encoder.

### Publishing makes a public snapshot.

It includes referenced snapshot assets. Later private edits don't change that link. Use Unpublish to remove the project's public snapshots.

Cloud binary export needs imported project assets for remote media and enforces size limits. Motion is limited to 60 seconds. Cloud recordings mix imported audio/video; browser fallback is silent. Google Slides needs Google authorization and supports native text/shapes/HTTPS images, with explicit errors for unsupported content.

06

LET YOUR AGENT JOIN THE WORKSPACE

## The same design, from another tool.

Use the studio directly, or connect the agent you already work with. Your agent reads the same project, makes targeted edits, and saves with the same revision protection.

[### API key & CLI Create a named key, inject it securely, and use the released dsa CLI. Manage access](https://beta.studio.agentkit.best/?settings=agents)[### Remote MCP Connect through Streamable HTTP with an API key or OAuth consent. Connection guide](https://beta.studio.agentkit.best/docs/mcp)[### Browser WebMCP In supported browsers, let an agent edit the open canvas and save explicitly. Browser tools](https://beta.studio.agentkit.best/docs/webmcp)

A FEW THINGS YOU MIGHT WONDER

## Before you begin.

### Do I need to know how to code?

No. You can create from a template, describe changes in chat, and use the manual editor. The CLI and APIs are available when you want to connect another agent or automate a workflow.

### Is an AI-provider key included?

No. You bring your own provider credentials and model access. Template selection and manual editing work without a provider. Generation calls use your account and may incur charges.

### Will the agent automatically publish my work?

Generating a proposal, saving a project, and publishing a public snapshot are separate operations. Tell your agent what sharing is authorized, and inspect the saved version before publication.

### Can I edit a generated image or video?

Compatible OpenAI/fal modes accept a source asset owned by the project. Image, video, and audio transformations have provider-specific requirements. Check the provider guide before choosing a model or source.

### Why does an exported file look different?

Different formats preserve different structures. SVG is static, PowerPoint rasterizes complex nodes, and Google Slides supports a smaller set of native elements. Always inspect the actual file; export support does not mean full editable parity.

## Start with one clear idea.

You can refine the details together.

[Open Design Studio](https://beta.studio.agentkit.best/)[Or explore the documentation](https://beta.studio.agentkit.best/docs)

[Design Studio AI](https://beta.studio.agentkit.best/)Open source · MIT licensed [Documentation](https://beta.studio.agentkit.best/docs)