Connect your own API key
The design agent chats in the Agent panel with a model from a service you have an account with: OpenRouter, OpenAI, Anthropic, Gemini, Groq or any OpenAI-compatible service. You connect it once with your own API key, and its requests use your own credit with that service.
Step by step
Open the Agent panel
Click Agent in the top bar, or press Alt A. The panel docks on the right of the editor.
Choose your own API key
The first time, the panel asks how you want to connect. Pick Your own API key and click Continue. You can switch later, under How you connect in the agent's settings.
Pick the provider
Pick the service your key is from. OpenRouter is recommended: one key for chat and images, with many models. Custom takes any OpenAI-compatible address and a model name. Click Continue: the agent's settings open.
Make a key on the provider's website
Sign in on the provider's website, create an API key and copy it. The website also shows its prices and what you have used: the agent's requests use the credit of that account.
Paste the key
Paste it in API key, under Agent model; the eye button beside it shows it. The key is kept in this browser only and sent straight to the provider: SVGcinema never sees it.
Pick a model and test it
Pick a model in Model (Other model… takes any name the provider uses), then click Test. It checks that the service can be reached from this page, knows the model and can use tools, and whether the model can see images.
Back to the chat
Click ‹ at the top of the panel. Describe what to make and press Enter: the agent works in this project, and each request is one undo step. The model's name under the message box switches to another of the provider's models.
Keys
| Alt A | Open or close the agent |