Getting it into your agent
This one installs as part of its plugin. Adding the marketplace and installing the plugin brings it with everything else the plugin ships.
/plugin marketplace add OthmanAdi/openui-forge/plugin install openui-forgeWrote this? Show the measurements
A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.
[](https://agentmods.dev/skills/othmanadi/openui-forge/openui-forge-openai)<a href="https://agentmods.dev/skills/othmanadi/openui-forge/openui-forge-openai"><img src="https://agentmods.dev/badge/skills/othmanadi/openui-forge/openui-forge-openai.svg" alt="Measured on agentmods" height="20"></a>What it costs to keep this loaded
Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.
| Model | Per session | Once invoked |
|---|---|---|
| Fable 5.1 | $0.00038 | $0.01812 |
| Opus 5 | $0.00019 | $0.00906 |
| Sonnet 5 | $0.00008 | $0.00362 |
| Haiku 4.5 | $0.00004 | $0.00181 |
Grade A, and why
openui-forge-openai scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 6d ago.
A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.
Nothing flagged
None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.
How it starts
The opening of the file, as written. The whole thing — 166 lines — stays where its author put it; the contents beside it link to each section on GitHub.
OpenUI Forge — OpenAI
Build generative UI apps with OpenUI + OpenAI SDK. One backend, one adapter, streaming out of the box.
Activation Triggers
- "openui openai", "openui gpt", "openui chatgpt"
- "generative ui openai", "openai streaming ui"
Prerequisites
- Node.js >= 22 (24 LTS recommended), React >= 18.3.1 (19+ recommended)
OPENAI_API_KEYenvironment variable set- Optional:
OPENAI_BASE_URLto route via an OpenAI-compatible provider (Gemini, OpenRouter, xAI, DeepSeek, etc.) without code changes.OPENAI_BASE_URLis the correct env var; the legacyOPENAI_API_BASEwas removed in openai v6. See Provider Routing below. - Optional:
OPENAI_MODELto pin a specific model (defaults togpt-5.5) - Next.js project (App Router recommended)
Provider Routing
This is the OpenAI-compatible variant: the same OpenAI client and chat.completions.create code talks to any provider below by setting OPENAI_BASE_URL (and OPENAI_MODEL). No code changes. OPENAI_BASE_URL is the correct env var; the old OPENAI_API_BASE was removed in openai v6.
| Provider | OPENAI_BASE_URL |
Example OPENAI_MODEL |
|---|---|---|
| Gemini | https://generativelanguage.googleapis.com/v1beta/openai/ |
gemini-3.5-flash |
| OpenRouter | https://openrouter.ai/api/v1 |
anthropic/claude-opus-4.7 |
| xAI (Grok) | https://api.x.ai/v1 |
grok-4.3 |
| DeepSeek | https://api.deepseek.com |
deepseek-v4-pro |
| Groq | https://api.groq.com/openai/v1 |
llama-3.3-70b-versatile |
| Mistral | https://api.mistral.ai/v1 |
mistral-large-latest |
| Together | https://api.together.ai/v1 |
openai/gpt-oss-20b |
| Fireworks | https://api.fireworks.ai/inference/v1 |
accounts/fireworks/models/glm-5 |
| Ollama (local) | http://localhost:11434/v1/ |
llama3.3 (any placeholder API key) |
| LM Studio (local) | http://localhost:1234/v1 |
loaded model id (any placeholder API key) |
Model ids drift; check each provider's current catalog. Base-url routing covers chat completions only, not full OpenAI API parity.
What this file has done since we first saw it
Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.
- 6d ago First seen · 166 lines · 38 tokens per session scan A d06f5b66e790
openui-forge-openai is a skill published in the GitHub repository OthmanAdi/openui-forge (22 stars, last pushed 1mo ago), licensed MIT. It adds 38 tokens to every session and 1,812 once invoked, about $0.0002 per session on Opus 5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-30.
Other skills, from other repositories
migrate-state-management
Migrate Redux or React Context to the correct state option (React Query for server state, nuqs for URL/shareable state, Zustand for global client state). Use when refactoring away from Redux/Context, moving state to the right store, or when the user asks to migrate state management.
mdma-integration
Integrate MDMA into an application and build features with it — wire up parsing, the runtime store, React rendering, LLM streaming, custom components, prompts, and CI validation. Use this skill when the user asks to add MDMA to an app, build a chat that streams MDMA, author or maintain a custom prompt, validate MDMA…
project-frontend
Apply React/TypeScript/Vite patterns used in ai-viewer's frontend. Use when editing frontend/ — pages, components, API client, SSE handling, D3 visualizations.
admin-console-blueprint
Use when you need to design, scaffold, refactor, or document a medium-sized admin console built as an independent Vite/React SPA backed by modular Go admin APIs, Cookie session auth, and CLI-provisioned administrator accounts. Helpful for tasks like planning a new admin console, extracting reusable architecture from…
wuji-frontend-suite
Unified frontend Skill for building or replacing active pages, applying React and design-system practices, and completing real browser QA. Use for frontend implementation, page redesign, component work, or UI bug fixes without exposing separate builder and tester Skills.
vercel-react-best-practices
React and Next.js performance optimization guidelines from Vercel Engineering. This skill should be used when writing, reviewing, or refactoring React/Next.js code to ensure optimal performance patterns. Triggers on tasks involving React components, Next.js pages, data fetching, bundle optimization, or performance…