Spaces:
Running
Running
File size: 14,520 Bytes
47813cf 247086c 47813cf 247086c 47813cf e6f9c10 47813cf e6f9c10 47813cf e6f9c10 47813cf e6f9c10 47813cf e6f9c10 47813cf 247086c 47813cf | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 | <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Configuring coding agents with Modelflare: Claude Code, Codex, OpenCode, Gemini CLI, CC-Switch, and Grok Build | Modelflare Blog</title>
<meta name="description" content="Claude Code connects through Anthropic Messages at `https://modelflare.dev`, Codex, OpenCode, and Grok Build through `https://modelflare.dev/v1`, and Gemini CLI through `GOOGLE_GEMINI_BASE_URL`. All of them use the same Modelflare key."><meta property="og:image" content="images/coding-agents-modelflare-cover.jpg">
<style>
:root{--bg:#0b1020;--card:#121a2f;--text:#e8ecf7;--muted:#9aa6c2;--accent:#8b5cf6;--accent2:#ec4899;--border:rgba(255,255,255,.08)}
*{box-sizing:border-box}
body{margin:0;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;background:radial-gradient(1200px 600px at 10% -10%,#2a1850 0%,transparent 50%),radial-gradient(900px 500px at 100% 0%,#3b0f2e 0%,transparent 45%),var(--bg);color:var(--text);min-height:100vh;line-height:1.65}
.wrap{max-width:860px;margin:0 auto;padding:28px 18px 64px}
header.top{display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:space-between;margin-bottom:28px;font-size:14px}
header.top a{color:var(--muted);text-decoration:none}header.top a:hover{color:#fff}
header.top .brand{color:#fff;font-weight:700;font-size:16px}
header.top nav{display:flex;flex-wrap:wrap;gap:14px}
h1{font-size:clamp(26px,4.6vw,38px);line-height:1.2;margin:0 0 12px}
h2{font-size:22px;margin:36px 0 10px}h3{font-size:17px;margin:24px 0 8px;color:#d6c7ff}
p,li{color:#cfd6e8}a{color:#c4b5fd}
.lead{color:var(--muted);font-size:17px}
article img{max-width:100%;height:auto;border-radius:12px;border:1px solid var(--border);display:block;margin:18px auto 6px}
article p em:only-child{display:block;text-align:center;color:var(--muted);font-size:14px}
pre{background:#070b16;border:1px solid var(--border);border-radius:12px;padding:0;overflow-x:auto}
pre code.hljs{background:transparent;padding:14px 16px;font-size:13.5px;line-height:1.55}
code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.92em}
p code,li code,td code{background:rgba(139,92,246,.14);padding:1px 5px;border-radius:5px}
table{border-collapse:collapse;width:100%;font-size:14px;margin:14px 0;display:block;overflow-x:auto}
th,td{border:1px solid var(--border);padding:8px 10px;text-align:left;vertical-align:top}th{background:var(--card)}
hr{border:0;border-top:1px solid var(--border);margin:32px 0}
.list{display:grid;gap:14px}
.card{display:flex;gap:16px;background:var(--card);border:1px solid var(--border);border-radius:16px;padding:18px;text-decoration:none;color:inherit}
.card:hover{border-color:rgba(139,92,246,.5)}
.card img{width:200px;height:105px;object-fit:cover;border-radius:10px;flex-shrink:0}
.card h2{font-size:18px;margin:0 0 6px;color:#fff}.card p{margin:0;color:var(--muted);font-size:14px}
footer{margin-top:48px;padding-top:18px;border-top:1px solid var(--border);color:var(--muted);font-size:13px}
footer a{color:var(--muted)}
@media(max-width:600px){.card{flex-direction:column}.card img{width:100%;height:auto;aspect-ratio:1200/630}}
</style>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@highlightjs/cdn-assets@11.9.0/styles/github-dark.min.css"><script src="https://cdn.jsdelivr.net/npm/@highlightjs/cdn-assets@11.9.0/highlight.min.js"></script><script>document.addEventListener("DOMContentLoaded",()=>hljs.highlightAll());</script>
</head>
<body><div class="wrap"><header class="top"><a class="brand" href="index.html">Modelflare Blog</a><nav><a href="https://modelflare.dev/?utm_source=huggingface&utm_medium=space&utm_campaign=blog">modelflare.dev</a><a href="https://docs.modelflare.dev/?utm_source=huggingface&utm_medium=space&utm_campaign=blog">Docs</a><a href="https://castaly.modelflare.dev/?utm_source=huggingface&utm_medium=space&utm_campaign=blog">Castaly</a><a href="https://huggingface.co/Modelflare" target="_top">Hugging Face org</a></nav></header>
<article><h1>Configuring coding agents with Modelflare: Claude Code, Codex, OpenCode, Gemini CLI, CC-Switch, and Grok Build</h1>
<p class="lead">Claude Code connects through Anthropic Messages at <code>https://modelflare.dev</code>, Codex, OpenCode, and Grok Build through <code>https://modelflare.dev/v1</code>, and Gemini CLI through <code>GOOGLE_GEMINI_BASE_URL</code>. All of them use the same Modelflare key.</p>
<img src="images/coding-agents-modelflare-cover.jpg" alt="Diagram: a coding agent connected through a gateway to several services">
<hr />
<p>Coding agents expect different wire protocols. Claude Code uses Anthropic Messages, Codex and Grok Build use the OpenAI Responses API, OpenCode uses an OpenAI-compatible provider, and Gemini CLI uses the native Gemini API. <a href="https://modelflare.dev/?utm_source=huggingface&utm_medium=space&utm_campaign=coding-agents-modelflare">Modelflare</a> serves all of them behind one key. This guide gives the configuration for each client, taken from the Modelflare documentation.</p>
<p>Note the base URL difference. <code>ANTHROPIC_BASE_URL</code> is <code>https://modelflare.dev</code> without <code>/v1</code>, because Claude Code appends the Messages path itself. OpenAI-style clients use <code>https://modelflare.dev/v1</code>.</p>
<p><img alt="Table: base URL setting and value for Claude Code, Codex, Grok Build, OpenCode, Gemini CLI, and CC-Switch" src="images/fig-agent-map.svg" />
<em>Base URL per client. Anthropic, Gemini, and CC-Switch use the site origin; OpenAI-style clients use /v1.</em></p>
<h2>API key</h2>
<p>In the <a href="https://modelflare.dev/?utm_source=huggingface&utm_medium=space&utm_campaign=coding-agents-modelflare">console</a>, create an API key in a non-default group that can access the model the agent will use. The guides below use <code>claude-opus-4-8</code> and <code>claude-sonnet-5</code> for Claude Code, <code>gpt-5.6-sol</code> for Codex and OpenCode, and <code>grok-4.5</code> for Grok Build. A Smart API Key is an alternative: it resolves a routing group on each request across every model the account can use, so no group needs to be chosen.</p>
<h2>Claude Code</h2>
<p>The installer installs the official CLI when needed, asks for the key once, backs up and merges existing user settings, and verifies both configured models. On Windows PowerShell, run <code>irm https://modelflare.dev/install/claude.ps1 | iex</code> instead.</p>
<pre><code class="language-bash">curl -fsSL https://modelflare.dev/install/claude.sh | sh
</code></pre>
<p>For a manual setup, write the following to <code>~/.claude/settings.json</code>:</p>
<pre><code class="language-json">{
"env": {
"ANTHROPIC_BASE_URL": "https://modelflare.dev",
"ANTHROPIC_AUTH_TOKEN": "YOUR_MODELFLARE_API_KEY",
"ANTHROPIC_MODEL": "claude-opus-4-8",
"ANTHROPIC_DEFAULT_OPUS_MODEL": "claude-opus-4-8",
"ANTHROPIC_DEFAULT_SONNET_MODEL": "claude-sonnet-5",
"ANTHROPIC_DEFAULT_HAIKU_MODEL": "claude-sonnet-5"
}
}
</code></pre>
<p>Restrict the file with <code>chmod 600 ~/.claude/settings.json</code>, start <code>claude</code> in a trusted project directory, and send "Reply with one sentence confirming the active model." A normal reply confirms the setup.</p>
<h2>Codex</h2>
<p>The installer is <code>curl -fsSL https://modelflare.dev/install/codex.sh | sh</code>. For a manual setup, create <code>~/.codex/config.toml</code>:</p>
<pre><code class="language-toml">cli_auth_credentials_store = "file"
model_provider = "modelflare"
model = "gpt-5.6-sol"
model_reasoning_effort = "xhigh"
disable_response_storage = true
model_supports_reasoning_summaries = true
[model_providers.modelflare]
name = "Modelflare"
base_url = "https://modelflare.dev/v1"
wire_api = "responses"
requires_openai_auth = true
</code></pre>
<p>and <code>~/.codex/auth.json</code>:</p>
<pre><code class="language-json">{
"auth_mode": "apikey",
"OPENAI_API_KEY": "YOUR_MODELFLARE_API_KEY"
}
</code></pre>
<p>Keep both files private (<code>chmod 600 config.toml auth.json</code> on macOS and Linux). Do not add a provider <code>auth</code> command block; current Codex releases require <code>requires_openai_auth = true</code> for this API-key path.</p>
<p>Run <code>codex --model gpt-5.6-sol</code> and send "Reply with one sentence confirming the active model and provider." If a ChatGPT login screen appears, quit every Codex session and reopen the CLI. A <code>model_not_found</code> error means the key's group cannot serve <code>gpt-5.6-sol</code>.</p>
<h2>OpenCode</h2>
<p>Add <code>opencode.json</code> to the project directory:</p>
<pre><code class="language-json">{
"$schema": "https://opencode.ai/config.json",
"model": "modelflare/gpt-5.6-sol",
"provider": {
"modelflare": {
"npm": "@ai-sdk/openai-compatible",
"name": "Modelflare",
"options": { "baseURL": "https://modelflare.dev/v1" },
"models": {
"gpt-5.6-sol": { "name": "GPT 5.6 Sol" }
}
}
}
}
</code></pre>
<p>Start <code>opencode</code>, enter <code>/connect</code>, choose Other, set the provider id to <code>modelflare</code>, and paste the key. Select the model with <code>/models</code>.</p>
<h2>Gemini CLI</h2>
<pre><code class="language-bash">npm install -g @google/gemini-cli@latest
gemini --version
</code></pre>
<p>Set the key and base URL (Linux or macOS; on Windows PowerShell use <code>$env:GEMINI_API_KEY</code> and <code>$env:GOOGLE_GEMINI_BASE_URL</code>):</p>
<pre><code class="language-bash">export GEMINI_API_KEY="YOUR_MODELFLARE_API_KEY"
export GOOGLE_GEMINI_BASE_URL="https://modelflare.dev"
</code></pre>
<p>Then start the CLI with a model ID from the Modelflare catalog:</p>
<pre><code class="language-bash">gemini --model YOUR_MODEL_ID
</code></pre>
<p>If the CLI prompts for an authentication method, choose Use Gemini API key.</p>
<h2>CC-Switch</h2>
<p>CC-Switch stores Codex, OpenAI-compatible, and Claude Code profiles and switches between them without manual file edits. On the Modelflare API Keys page, open a key's action menu, select Import to CC Switch, choose Claude Code or Codex, and confirm the primary model. Then enable the imported provider in CC-Switch; the import does not switch the active provider automatically. To add the provider manually, create a Universal Provider with the Custom Gateway preset and set the API URL to <code>https://modelflare.dev</code>. The import link contains the API key, so use it only on a trusted device.</p>
<h2>Grok Build</h2>
<p>Grok Build uses the Responses API. Its guide uses a key that can access <code>grok-4.5</code>, the key in the <code>MODELFLARE_API_KEY</code> environment variable, and this <code>~/.grok/config.toml</code>:</p>
<pre><code class="language-toml">[models]
default = "modelflare-grok"
[model.modelflare-grok]
model = "grok-4.5"
base_url = "https://modelflare.dev/v1"
name = "Modelflare Grok 4.5"
env_key = "MODELFLARE_API_KEY"
api_backend = "responses"
</code></pre>
<p>Test the connection with <code>grok -p "Reply only: Modelflare connected" -m modelflare-grok</code>.</p>
<p>Other tools that accept an OpenAI-compatible base URL can be pointed at <code>https://modelflare.dev/v1</code>.</p>
<h2>Image and video generation from an agent</h2>
<p>The Modelflare Media Skill is an installable <code>SKILL.md</code> package for Claude Code, Codex, and other agents that read skills. With it, an agent can select an image or video model, quote the price, submit the request, wait for video tasks, and save the result. To install it, send the agent: "Install this skill: https://modelflare.dev/skills/modelflare-media/modelflare-media.zip (or use the attached zip), then read its SKILL.md. If you do not support skills, extract it anywhere and follow SKILL.md. My key is in the environment variable MODELFLARE_API_KEY." The skill reads the live catalog and each model's documentation page at call time and requires Node.js 18 or newer. See the <a href="https://docs.modelflare.dev/guides/clients/media-skill/?utm_source=huggingface&utm_medium=space&utm_campaign=coding-agents-modelflare">Media Skill guide</a>.</p>
<h2>References</h2>
<p>The <a href="https://huggingface.co/spaces/Modelflare/coding-agents" target="_top">Modelflare/coding-agents</a> Space collects these setups. Related Spaces are <a href="https://huggingface.co/spaces/Modelflare/openai-sdk" target="_top">Modelflare/openai-sdk</a>, <a href="https://huggingface.co/spaces/Modelflare/api-recipes" target="_top">Modelflare/api-recipes</a>, and <a href="https://huggingface.co/spaces/Modelflare/start" target="_top">Modelflare/start</a>. Full client guides: <a href="https://docs.modelflare.dev/guides/clients/claude-code/?utm_source=huggingface&utm_medium=space&utm_campaign=coding-agents-modelflare">Claude Code</a>, <a href="https://docs.modelflare.dev/guides/clients/codex/?utm_source=huggingface&utm_medium=space&utm_campaign=coding-agents-modelflare">Codex</a>, <a href="https://docs.modelflare.dev/guides/clients/gemini-cli/?utm_source=huggingface&utm_medium=space&utm_campaign=coding-agents-modelflare">Gemini CLI</a>. For team or enterprise arrangements, contact <a href="mailto:business@modelflare.dev">business@modelflare.dev</a>.</p></article><p><a href="index.html">← All articles</a></p>
<footer>Modelflare on Hugging Face: <a href="https://huggingface.co/spaces/Modelflare/start" target="_top">start</a> 路 <a href="https://huggingface.co/spaces/Modelflare/openai-sdk" target="_top">openai-sdk</a> 路 <a href="https://huggingface.co/spaces/Modelflare/coding-agents" target="_top">coding-agents</a> 路 <a href="https://huggingface.co/spaces/Modelflare/api-recipes" target="_top">api-recipes</a> 路 <a href="https://huggingface.co/datasets/Modelflare/api-examples" target="_top">api-examples dataset</a><br>Business: <a href="mailto:business@modelflare.dev">business@modelflare.dev</a></footer></div></body>
</html>
|