Design MCP for Codex CLI and Gemini CLI

Codex CLI

Add the server with the first command in the block below, then run the login command. The login opens uberdesigner in your browser; sign in and return to the terminal. From then on, a Codex session on that machine can call the server's tools.

If your repository has an AGENTS.md, it is a good place for one standing line about design sources, such as which server to use for design work and that a browse comes before any build. The agent reads that file at the start of a task.

Gemini CLI

Gemini CLI takes the address with an add command that names the transport, as shown in the block. The sign-in is started from inside a session with /mcp auth followed by the server's name. The browser step is the same as in every other client: you sign in to your own uberdesigner account.

Write the request as a task with a stop in it

A terminal agent works best from a request that reads like a small task card: the goal, the inputs, the stop, the checks. The stop is the line that says "report the options and wait". Put it in its own sentence so it is not read as a preference.

After you pick, the second message can be long-running: fetch the template, build it, run it, check it, report. Name the commands that count as done, such as a clean build and a preview that opens, because a terminal agent treats named commands as the finish line.

Before you hand a terminal agent a design task

• Both commands ran: the add and the login.
• The browser sign-in finished and the terminal confirmed it.
• The session started after the server was added, so the agent sees its tools.
• The request has a stop: options first, then wait.
• Inputs have paths: where the copy, images and data are in the repository.
• Done is a command: build passes, preview runs, widths checked.

A prompt to start from

# Codex CLI
codex mcp add uberdesigner --url https://uberdesigner.ai/api/mcp
codex mcp login uberdesigner

# Gemini CLI
gemini mcp add --transport http uberdesigner https://uberdesigner.ai/api/mcp
# then, inside Gemini CLI:
/mcp auth uberdesigner

# First request:
Task: choose a design for [what it is, e.g. the launch page of a field recorder that costs 240 and ships in March], using the uberdesigner MCP server.

Step 1. Call the library browse tool once. Report three candidates: name, link, free or Pro, and one sentence each on how my product would sit in that design. Then stop and wait for my choice. Do not fetch a template in this step.

Step 2, after I choose. Fetch that template by name. Build it in ./site as Vite + React + TypeScript, plain CSS. Keep its type, spacing, colours and motion. Replace the subject with mine: copy in ./brief/copy.md, [number] product photos in ./brief/photos, specs in ./brief/specs.json. Use real values only; leave a visible TODO where something is missing.

Done means: npm run build exits clean, the preview opens, the page holds at 390px and 1440px wide, and reduced motion shows a still version. Report what you ran and what you changed from the template.

Needs Codex CLI or Gemini CLI with the uberdesigner MCP server added and signed in. Run only the pair of commands for your tool.

Keep reading

• What to ask a connected agentFive habits for requests to an agent with a design MCP: browse first, compare options, name the template, say what is yours, and tell it to keep the design.
• How to choose a design MCPFive criteria for judging a design MCP server: what its tools return, who made the designs, how you sign in, what counts against your plan, and whether results are checked.

• Claude Code
• Cursor and editors
• Chat apps
• Whole websites
• UI components
• Design morphing