# Design Studio AI

Open-source, agent-first design workspace for AI agents and humans.

Source: <https://nextlevelbuilder.io/vi/products/design-studio-ai>

Website: <https://studio.agentkit.best>

Logo: <https://nextlevelbuilder.io/media/products/design-studio-ai/logo-360dc11c.webp>

Design Studio AI is an open-source, agent-first workspace for web interfaces, slides, reports, wireframes, 3D scenes and timeline video. People and agents edit the same revision-checked document through the web UI, REST, the dsa CLI, MCP and experimental WebMCP. Generation is bring-your-own-key for text, image, speech, music and video providers. Designs export to formats including HTML, SVG, PNG, PDF, PowerPoint, MP4/WebM, GLB/glTF and Google Slides, and the studio runs on Cloudflare or Docker.

Categories: design, ai-agents, mcp

Tags: design, slides, 3d, motion, mcp, webmcp, byok, open-source

## hero

- **headline:** One canvas for you and your agents
- **subheadline:** Design web pages, slides, reports, wireframes, 3D scenes and timeline video in a shared, revision-checked document that people and agents edit together.
- **primary Cta Text:** Open the studio
- **primary Cta Url:** https://studio.agentkit.best
- **badge:** Built by the NLB team


## media Gallery

- **images:**
  -
    - **url:** https://nextlevelbuilder.io/media/products/design-studio-ai/media-1-41defae8.webp
    - **caption:** Design Studio AI: an agent-first design workspace for people and AI agents.
    - **aspect Ratio:** 16:9
  -
    - **url:** https://nextlevelbuilder.io/media/products/design-studio-ai/media-2-62911e3f.webp
    - **caption:** The workspace: every design, slide deck, document and scene in one place.
    - **aspect Ratio:** 16:9
  -
    - **url:** https://nextlevelbuilder.io/media/products/design-studio-ai/media-3-380b54d8.webp
    - **caption:** Web editor: interfaces that people and agents edit through the same revision-checked document.
    - **aspect Ratio:** 16:9
  -
    - **url:** https://nextlevelbuilder.io/media/products/design-studio-ai/media-4-938ca776.webp
    - **caption:** Slides editor, with export to PowerPoint, PDF and Google Slides.
    - **aspect Ratio:** 16:9
  -
    - **url:** https://nextlevelbuilder.io/media/products/design-studio-ai/media-5-b059c520.webp
    - **caption:** 3D scene editor with editable rigged characters and GLB/glTF export.
    - **aspect Ratio:** 16:9


## grid

- **columns:** 3
- **items:**
  -
    - **title:** Many formats
    - **description:** Web, slides, documents, wireframes, 3D scenes and timeline video.
  -
    - **title:** Agents as co-editors
    - **description:** One versioned document through the UI, REST, the dsa CLI, MCP and WebMCP.
  -
    - **title:** Bring your own keys
    - **description:** Text, image, speech, music and video generation with your own provider keys.
  -
    - **title:** Characters in motion
    - **description:** 2D character motion and editable rigged 3D characters.
  -
    - **title:** Export anywhere
    - **description:** HTML, SVG, PNG, PDF, PPTX, MP4/WebM, React ZIP, GLB/glTF and Google Slides.
  -
    - **title:** Self-hosted
    - **description:** Run it on Cloudflare or Docker with SQLite.


## tech Stack

- **technologies:**
  -
    - **name:** TypeScript
    - **category:** Language
  -
    - **name:** React
    - **category:** UI
  -
    - **name:** Vite
    - **category:** Build
  -
    - **name:** Hono
    - **category:** API
  -
    - **name:** three.js
    - **category:** 3D
  -
    - **name:** MCP SDK
    - **category:** Agents
  -
    - **name:** Cloudflare Workers
    - **category:** Hosting
  -
    - **name:** Docker
    - **category:** Self-hosting


## pricing

- **tiers:**
  -
    - **name:** Open source
    - **price:** Free
    - **period:** MIT license
    - **features:**
      - Every editor and exporter
      - Bring-your-own-key generation
      - Cloudflare or Docker self-hosting
    - **cta Text:** View on GitHub
    - **cta Url:** https://github.com/bestagentkits/design-studio-ai
    - **is Popular:** true


## faq

- **items:**
  -
    - **question:** How do I install the CLI?
    - **answer:** Install the release package: npm install -g https://github.com/bestagentkits/design-studio-ai/releases/download/v0.4.3/bestagentkits-design-studio-ai-0.4.3.tgz
  -
    - **question:** Can my coding agent edit designs?
    - **answer:** Yes. Agents use the same document as people, through REST, the dsa CLI, MCP or the experimental WebMCP tools.
  -
    - **question:** Is it open source?
    - **answer:** Yes, MIT licensed at github.com/bestagentkits/design-studio-ai.


## founder

- **name:** Duy Nguyen
- **bio:** CTO and co-founder of T.O.P Group, creator of GoClaw and UI UX Pro Max, and founder of the Build in Public Vietnam community.
- **avatar Url:** https://nextlevelbuilder.io/img/founders/duy.webp
- **x Handle:** goon\_nguyen


## cta

- **title:** Design with your agents, not around them
- **subtitle:** Self-host Design Studio AI or try the hosted studio.
- **button Text:** Star it on GitHub
- **button Url:** https://github.com/bestagentkits/design-studio-ai


Trust Score: 60/100

Organic votes: 0