Automated summary
This skill researches the OpenRouter API to integrate Grok models, including vision capabilities, for evaluating generated images in the SFUMATO project.
Strengths
- Comprehensive coverage of OpenRouter APIs (authentication, endpoints, request formats)
- Precise identification of Grok models supporting vision, critical for judge_service
- Documentation of base64 image formats for vision calls
- Error handling and retry strategy adapted to common HTTP status codes
Limitations
- Depends on freshness of web search results (models or APIs may change)
- Provides a blueprint, not a ready-to-use implementation
- Does not cover alternative providers or models
When implementing or debugging OpenRouter integration for text and vision calls with Grok.
If you are using a different API provider or if the Grok models do not require vision capabilities.
Security analysis
SafeThis skill instructs only research activities using WebSearch, WebFetch, and Read tools to gather API documentation. No destructive, exfiltrating, or obfuscated actions are present. No executable commands or dangerous operations are suggested.
No concerns found
How this analysis is madeExamples
Research the OpenRouter API to find which Grok models support vision/image input for evaluating generated images in our judge service.Research OpenRouter error handling patterns: how to handle 429, 402, and 503 errors, and what retry strategy to use for async httpx calls.Find the correct message format for sending base64 images to OpenRouter's vision API for Grok models in a chat completion request.name: openrouter-research description: Research OpenRouter API docs, available Grok model IDs, vision capability for the judge service, and integration patterns. Use when implementing openrouter_tool.py, when checking which Grok model supports vision/image input for judge_service.py, when OpenRouter returns unexpected errors, or when verifying model availability and context limits. tools: WebSearch, WebFetch, Read
OpenRouter Research
Research current OpenRouter API specifications and Grok model availability for SFUMATO.
Context
All text LLM calls in SFUMATO go through app/tools/openrouter_tool.py:
prompt_service.generate_prompt()— Grok, text-only inputprompt_service.revise_prompt()— Grok, text-only inputjudge_service.evaluate()— Grok with vision (must analyze generated image)
ENV vars: OPENROUTER_API_KEY, OPENROUTER_BASE_URL=https://openrouter.ai/api/v1
Client: httpx.AsyncClient — OpenAI-compatible API
Read existing file first if it exists:
app/tools/openrouter_tool.pyconfig.py
Step 1: OpenRouter API Fundamentals
- Fetch:
https://openrouter.ai/docs/api-reference/overview - Fetch:
https://openrouter.ai/docs/requests - Search:
OpenRouter API python httpx async chat completions 2025
Capture:
- Base URL:
https://openrouter.ai/api/v1 - Auth header format (
Authorization: BearervsAPI-Key) - Required request headers:
HTTP-Referer,X-Title - Chat completions endpoint:
POST /v1/chat/completions - Request body schema:
model,messages,temperature,max_tokens,stream - Response schema:
choices[0].message.content - Error response format and status codes (429, 402, 503, 500)
Step 2: Available Grok Models
- Fetch:
https://openrouter.ai/models?q=grok - Search:
OpenRouter xAI Grok models list 2025 - Fetch:
https://openrouter.ai/x-aiif available
For each available Grok model, capture:
- Full model ID string (e.g.
x-ai/grok-beta,x-ai/grok-vision-beta) - Context window size (tokens)
- Supports image input (vision)? — critical for judge_service
- Cost per 1M input/output tokens
Determine the best model for each use case:
prompt_gen: text-only, large contextprompt_revise: text-onlyjudge: MUST support vision/image input
Step 3: Image Input Format for Vision Models
Since judge_service.py sends a generated image to Grok for evaluation:
- Search:
OpenRouter vision model image input base64 format 2025 - Fetch:
https://openrouter.ai/docs/features/vision - Search:
OpenAI-compatible vision API image_url content type format
Capture:
- Message content format for image:
vs URL-based image reference{"type": "image_url", "image_url": {"url": "data:image/jpeg;base64,..."}} - Max image size limits
- Supported formats (JPEG, PNG, WebP)
- Whether OpenRouter passes base64 to xAI directly or requires URL
Step 4: Error Handling and Retry Strategy
- Search:
OpenRouter API error handling retry 429 503 2025 - Fetch:
https://openrouter.ai/docs/api-reference/errorsif available
Capture:
- 429 rate limit:
retry-afterheader? fixed backoff interval? - 402 payment/balance: raise immediately, no retry
- 503 model unavailable: retry with backoff
- Recommended timeout values for text calls vs vision calls
- Max retries pattern
Output Format
Section 1: openrouter_tool.py Implementation Blueprint
# Async httpx client structure
BASE_URL = "https://openrouter.ai/api/v1"
# Required headers
headers = {
"Authorization": f"Bearer {api_key}",
"HTTP-Referer": "...",
"X-Title": "SFUMATO",
"Content-Type": "application/json",
}
# chat_completion(model, messages, temperature, max_tokens) -> str
# vision_completion(model, text_messages_plus_image_message) -> str
# Retry pattern for 429/503 (show how many retries, backoff)
# Error handling: which codes to retry vs raise immediately
Section 2: Model Selection Table
| Use Case | Recommended Model ID | Context | Vision | Notes | |----------|---------------------|---------|--------|-------| | prompt_gen | x-ai/grok-... | N | No | | | prompt_revise | x-ai/grok-... | N | No | | | judge | x-ai/grok-... | N | YES | Required |
Section 3: Image Message Format
Exact Python dict structure to use when sending image to judge:
{
"role": "user",
"content": [
{"type": "text", "text": "...judge prompt..."},
{"type": "image_url", "image_url": {"url": "data:image/jpeg;base64,..."}}
]
}
Section 4: Recommended Constants for config.py
OPENROUTER_BASE_URL = "https://openrouter.ai/api/v1"
OPENROUTER_MODEL_PROMPT_GEN = "x-ai/grok-..."
OPENROUTER_MODEL_PROMPT_REVISE = "x-ai/grok-..."
OPENROUTER_MODEL_JUDGE = "x-ai/grok-vision-..." # must support vision
OPENROUTER_TIMEOUT_TEXT = 30
OPENROUTER_TIMEOUT_VISION = 45
OPENROUTER_MAX_RETRIES = 2
Notes
- Never log API key, response.text for large vision calls, or base64 image data
- Image for judge: read from
data/sessions/<id>/iter_<n>.jpg, encode as base64 - The judge call is the only one that uses vision; wrap it separately in
vision_completion() HTTP-Referershould be"http://localhost:5000"for local dev
From the file to a first result
The download contains exactly the content displayed on this page. This copy may differ from the latest version in the source repository.
View the source and supporting filesThis download contains SKILL.md only. Any scripts, references, templates and dependencies are not included. Get the required files from the source, preserving their directory structure, before continuing.
1. Download the file
Download SKILL.mdFrom the root of a test project, save the file as .skill-downloads/openrouter-and-grok-models-research-mm78nmu3/SKILL.md, or use the command below. This folder is for inspecting the skill before installation.
Command for macOS/Linux or WSL: requires a POSIX shell and curl. On Windows without WSL, use the download button and create the folder manually.
mkdir -p '.skill-downloads/openrouter-and-grok-models-research-mm78nmu3' && curl --fail --show-error --location 'https://skills-guides.com/api/skills/openrouter-and-grok-models-research-mm78nmu3/download' --output '.skill-downloads/openrouter-and-grok-models-research-mm78nmu3/SKILL.md.part' && mv '.skill-downloads/openrouter-and-grok-models-research-mm78nmu3/SKILL.md.part' '.skill-downloads/openrouter-and-grok-models-research-mm78nmu3/SKILL.md'2. Check prerequisites
Read SKILL.md before using it. If it references scripts or external services, inspect them and prepare the required access in your test environment.
No recognized prerequisites section in this file. This does not mean it is self-contained: libraries, tools and access requirements may be mentioned elsewhere in the content or source repository.
The platforms on this page are catalog indications. The paths below follow tool documentation; they do not prove this skill has been run in those tools. No minimum tool version is confirmed for this listing.
3. Load the skill
After inspection, copy the complete folder into your project using one of the commands below, then open a new tool session. The command stops if a folder with the same name already exists: compare the files before replacing it.
Claude Code
test -f '.skill-downloads/openrouter-and-grok-models-research-mm78nmu3/SKILL.md' && test -s '.skill-downloads/openrouter-and-grok-models-research-mm78nmu3/SKILL.md' && mkdir -p '.claude/skills' && test ! -e '.claude/skills/openrouter-research' && cp -R '.skill-downloads/openrouter-and-grok-models-research-mm78nmu3' '.claude/skills/openrouter-research'OpenSkills
OpenSkills must already be installed. The local install/read procedure is checked with OpenSkills 1.5.0, which requires Node.js ≥ 20.6.0. Catalog slugs are not resolved automatically.
Official OpenSkills installationopenskills install './.skill-downloads/openrouter-and-grok-models-research-mm78nmu3'openskills read 'openrouter-and-grok-models-research-mm78nmu3'Reading should display the installed file content and its base directory. It does not run the skill or install its dependencies.
For an agent that reads AGENTS.md, then sync the index. This command changes AGENTS.md: review the diff before using it.
openskills syncManual method or another tool: attach SKILL.md to a conversation, or open it in an agent that can read files. Include any required supporting resources. No universal folder is recognized by every tool.
4. Try a first task
Use a short, synthetic input: an API endpoint, a small document or an interface brief. In a new conversation, attach the file or give the agent its path, then adapt this request:
Read .skill-downloads/openrouter-and-grok-models-research-mm78nmu3/SKILL.md and apply its instructions to this example: [describe a test input]. Identify any missing files, dependencies or access. Produce the result requested by the skill without inventing data or running unreviewed scripts.Expected result: output matching the skill instructions, or a precise list of missing prerequisites. A read confirmation alone does not validate a first use. If an external resource is unavailable, that path remains untested.
React Hook Form Best Practices
Development
Master React Hook Form: avoid anti-patterns, manage subscriptions, and handle reset, dirty state, and controlled inputs correctly.
Emotion to Mantine Migration
Development
Migrate Emotion styled-components to Mantine components with style props and CSS modules. Use when converting .styled.tsx files or removing @emotion imports.
Scope Creep Detector
Development
Analyzes git diffs against a stated intent to detect scope creep, unrelated files, broad PRs, and oversized changes, then suggests keep, split, or justify actions.