easels.dev

generate_design

The way to build. Give it what the person wants — "a payment app for mobile", "landing page for a note taking app", "the checkout screen", "add a pricing section" — and Easel designs it: it picks a real reference site for structure, follows the file's existing brand and colours, keeps a mobile app as phone screens (one under another on the same board), and lands everything as editable nodes with a live cursor. Do not write the html yourself and do not create an artboard first: a new web page gets its own artboard automatically, and a phone screen stacks below the last one. A mobile app landing as a phone shell centred on the Desktop board is the required result, not a mistake: never move it to a phone sized artboard or rebuild it. If this call returns while the cursor is still moving, the design is still landing; wait and call get_document rather than building anything. Call it once per page or screen. Returns a summary and the boards with what is on them. Use write_html only for a small component whose exact markup you already have.

Input schema

{
  "type": "object",
  "properties": {
    "prompt": {
      "type": "string",
      "description": "What to design."
    },
    "artboardId": {
      "type": "string",
      "description": "Where it lands. Defaults to the first artboard."
    },
    "provider": {
      "type": "string",
      "description": "Which model: \"openai\", \"kimi\", \"gemini\", or \"variety\" to run every configured one at once and stack the results for comparison. Defaults to the first one with a key."
    },
    "x": {
      "type": "number",
      "description": "Offset inside the artboard. Defaults to a free row below the existing design."
    },
    "y": {
      "type": "number"
    }
  },
  "required": [
    "prompt"
  ]
}