Overview
How open-frame and your coding agent work together.
open-frame treats your coding agent as a first-class user. Decks are React, agents are great at React, the gap between "make frames about X" and a polished deck is mostly the runtime — which open-frame provides.
What ships in the workspace
npx @open-frame/cli init generates an AGENTS.md (and CLAUDE.md) at the
root with the framework's hard rules, plus a skills/ folder with five
skills the agent invokes by name:
The skills are kept inside the workspace (not the agent's global config) so
they version with the project. open-frame sync:skills re-syncs them from
the package if you upgrade.
The hard rules (AGENTS.md)
Short, intentional, machine-readable:
- Frames go under
frames/<kebab-case-id>/. - Entry is
frames/<id>/index.tsx. - Assets sit in
frames/<id>/assets/. - Don't touch
package.json,open-frame.config.ts, or other frames. - Don't add dependencies. Use only React and standard web APIs.
These constraints protect the agent from itself: it can't accidentally install a UI library, rewrite global config, or stomp on another frame.
Bring your own agent
The framework is intentionally agent-agnostic. Any tool that can edit React files in a workspace can author frames. The community confirms with: Claude Code, Codex, Cursor, Gemini CLI, OpenCode, Windsurf, Zed.
To author cleanly, the agent needs to:
- Read the rules.
AGENTS.md(andCLAUDE.md) at the workspace root define the file contract and constraints. - Find the skills.
/create-frame,/frame-authoring,/apply-comments,/create-theme,/current-framelive underskills/(or wherever that agent looks for skills). - Edit files. That's it. There is no per-agent SDK.
If your agent of choice doesn't have a skills system, you can paste the
frame-authoring skill into context manually and ask the agent to follow
its rules.
Mirroring AGENTS.md for Claude Code
AGENTS.md is the canonical rules file — it follows the cross-tool
convention that Codex, Cursor, Gemini CLI, OpenCode, Windsurf, and Zed
already look for. CLAUDE.md is generated alongside it so Claude Code
picks the rules up automatically. The two files are kept in sync by the
scaffolder; edit AGENTS.md and re-run open-frame sync:skills if you
want the mirror refreshed.