Kite
The design canvas for agents and humans
About Kite
Kite is a design canvas where people and AI agents work on the same board. You connect the agent you already use, such as Claude, Cursor, ChatGPT or any other MCP client, and it draws screens, websites and brand assets beside you in a real design editor. Kite itself runs no AI model to design and sells no AI credits. Your agent runs on the plan you already pay for, and Kite charges only for the people who edit, so you never pay twice for the AI. It works in the browser and as a Mac app, and it is a separate product from kite.ai, an unrelated company.
The problem Kite addresses is that AI-generated designs often look like everyone else's and are hard to hand back into a real workflow. Kite has the agent read your design system before every draw: colors, type and spacing are stored as variables, reusable parts as components, and rules written in plain words as skills. Agents place copies of your components rather than redrawing a new card each time, and work with the same flex, grid and constraint fields a human designer uses, so their output is as exact as yours. A design in Kite is real HTML and CSS, which means what an agent writes and what you draw are the same thing. It also moves work in and out of the tools teams already use, with copy and paste both ways between Kite and Figma and a Chrome extension that captures any web page as editable layers.
First you connect an agent. Kite runs a remote MCP server, so Claude, ChatGPT, Cursor or another MCP client can connect in a click with no API key to copy.
Second you set up the system the agent should follow. You define variables for colors, type and spacing with light and dark modes, build components with variants, write skills that describe the brand's look or guardrails, and publish a library to the workspace.
Third you ask for the work. You can prompt the agent directly, or pin a comment on a frame and mention the agent. In Kite for Mac the request starts at once with Claude Code or Codex, the agent reads the frame and the layer you clicked, does the work and answers in the thread. In the browser, requests wait on their comments until you tell your agent to work through them.
Finally you refine and ship. You adjust any value to the pixel in the editor, preview a frame as the screen it will be, save versions, copy a frame to Figma, copy it as HTML, React or Tailwind, or export PNG, WebP, SVG or PDF.
- •Bring Your Own Agent - Claude, Cursor, ChatGPT or any MCP client connects through Kite's remote MCP server. Your team and your agents each get a pointer of their own and work in one file at the same time.
- •Design System Read Before Every Draw - Variables, components and plain-language skills are read by the agent before it draws, so changing one value or switching the system updates every frame drawn with it, including light and dark modes.
- •Requests in Comments - Mention your agent in a comment pinned to a frame and it handles the change and replies in the thread. A queue of requests can be worked through in one instruction, and sticky notes on the board are read by agents too.
- •A Real Design Editor - Flex, CSS grid and constraints, a pen and pencil for paths you can combine, flatten and outline, real type with Google, uploaded and local fonts, gradients, picture fills, shadows, blurs and live shader fills, plus version history and preview.
- •Figma and Chrome Round Trips - Paste Figma frames in as editable layers and send frames back with Copy to Figma, or use Kite Capture for Chrome to turn any web page, or part of one, into frames, text and pictures.
- •Code Out - Copy any frame as HTML, React or Tailwind with the values it really uses, or export images and PDFs at the size you need.
Kite is aimed at product designers, developers and founders who already use an AI coding or chat agent and want that agent to design inside a proper canvas rather than a prompt box. Designers who maintain a design system can let agents draft screens that follow its variables and components, then refine the results by hand. Developers using Claude Code, Codex or Cursor can request UI changes through comments and copy the finished frame out as HTML, React or Tailwind.
Teams moving between tools will value the two-way Figma copy and the Chrome capture extension, which bring existing work in as editable layers. Agencies and startups producing websites, app screens and brand launch kits can keep humans and agents in the same file, with comments, mentions, shared libraries and link-based sharing where viewers can still comment.
The free plan suits individuals and small groups trying it out, with unlimited editors and viewers, 3 files and 200 agent actions a day. Pro is for people who design in Kite every day and need unlimited files and agent actions and version history, while Team adds SSO and SAML, admin controls, custom contracts and dedicated onboarding for companies.
