$23
Works with
AI-first code editor with Composer
Before installing skills in Cursor, ensure your development environment meets these requirements:
node --versionagentationExecute the skills CLI command in your project's root directory to begin installation:
Fetches agentation from supercent-io/skills-template and configures it for Cursor.
The CLI shows a list of agents. Use arrow keys and space to select Cursor:
Confirm successful installation by checking the skill directory location:
Restart Cursor to activate agentation. Access via /agentation in your agent's command palette.
We perform automated surface-level scans (Gen AI Scanner, Socket, Snyk) during installation. These checks detect common vulnerabilities but do not guarantee complete security. Always review skill source code and verify the publisher's reputation before production use.
Skills execute code in your environment. Always review source, verify the publisher, and test in isolation before production.
Submit your Claude Code skill and start earning
Create detailed user stories, acceptance criteria, and feature specs
Example
Generate user stories for 'password reset feature' with acceptance criteria, edge cases, and test scenarios
Reduce spec writing time by 50%, ensure comprehensive coverage
Research competitors, compare features, identify gaps
Example
Analyze 5 competitor products, create feature comparison matrix, suggest differentiation opportunities
Complete competitive research in 2 hours instead of 2 days
Evaluate features using frameworks (RICE, ICE, Kano) and create prioritized backlogs
Example
Score 20 feature ideas using RICE framework, generate prioritized roadmap with rationale
0
total installs
0
this week
88
GitHub stars
0
upvotes
Run in your terminal
0
installs
0
this week
88
stars
The missing link between human eyes and agent code.
Instead of describing "the blue button in the sidebar," you hand the agent
.sidebar > button.primary. It cangrepfor that directly.
agent-browser + self-driving patternagentation (monorepo)
├── agentation → npm: agentation (React toolbar component)
│ └── src/index.ts → exports Agentation component + types + utilities
└── agentation-mcp → npm: agentation-mcp (MCP server + CLI)
├── src/cli.ts → agentation-mcp CLI (init, server, doctor)
└── src/server/ → HTTP REST API (port 4747) + SSE events + MCP stdio tools
Two modes of operation:
| Mode | How it works |
|---|---|
| Copy-Paste | Human annotates → clicks Copy → pastes markdown into agent chat |
| Agent Sync | endpoint prop connects toolbar to MCP server → agent uses agentation_watch_annotations loop |
npm install agentation -D
# or: pnpm add agentation -D / yarn add agentation -D / bun add agentation -D
Requirements: React 18+, desktop browser, zero runtime deps beyond React (desktop only — no mobile)
🔗 Local-first by design: Annotations are stored locally and auto-sync when connected to the MCP server.
- Offline operation — Annotations can be created without a server
- Session continuity — Same session persists after page refresh, no duplicates
- Agent-first — resolve/dismiss is handled by the agent
Fastest method — Auto-detects all installed agents and configures them (Claude Code, Cursor, Codex, Windsurf, and 9+ more agents):
npx add-mcp "npx -y agentation-mcp server"
Or install manually:
npm install agentation-mcp -D
npx agentation-mcp server # HTTP :4747 + MCP stdio
npx agentation-mcp server --port 8080 # custom port
npx agentation-mcp doctor # verify setup
Recommended for Claude Code users — automatically handles framework detection, package installation, and layout integration:
npx skills add benjitaylor/agentation
# then in Claude Code:
/agentation
import { Agentation } from 'agentation';
function App() {
return (
<>
<YourApp />
{process.env.NODE_ENV === 'development' && <Agentation />}
</>
);
}
// app/layout.tsx
import { Agentation } from 'agentation';
export default function RootLayout({ children }: { children: React.ReactNode }) {
return (
<html>
<body>
{children}
{process.env.NODE_ENV === 'development' && (
<Agentation endpoint="http://localhost:4747" />
)}
</body>
</html>
);
}
// pages/_app.tsx
import { Agentation } from 'agentation';
export default function App({ Component, pageProps }) {
return (
<>
<Component {...pageProps} />
{process.env.NODE_ENV === 'development' && (
<Agentation endpoint="http://localhost:4747" />
)}
</>
);
}
| Prop | Type | Default | Description |
|---|---|---|---|
endpoint |
string |
— | MCP server URL for Agent Sync mode |
sessionId |
string |
— | Pre-existing session ID to join |
onAnnotationAdd |
(a: Annotation) => void |
— | Callback when annotation created |
onAnnotationDelete |
(a: Annotation) => void |
— | Callback when annotation deleted |
onAnnotationUpdate |
(a: Annotation) => void |
— | Callback when annotation edited |
onAnnotationsClear |
(a: Annotation[]) => void |
— | Callback when all cleared |
onCopy |
(markdown: string) => void |
— | Callback with markdown on copy |
onSubmit |
(output: string, annotations: Annotation[]) => void |
— | On "Send Annotations" click |
copyToClipboard |
boolean |
true |
Set false to suppress clipboard write |
onSessionCreated |
(sessionId: string) => void |
— | Called on new session creation |
webhookUrl |
string |
— | Webhook URL to receive annotation events |
Fastest method — Universal (auto-detects 9+ agents):
npx add-mcp "npx -y agentation-mcp server"
add-mcp auto-detects Claude Code, Cursor, Codex, Windsurf, and more, writing directly to the correct config.
Start server / verify:
npx agentation-mcp server # HTTP :4747 + MCP stdio
npx agentation-mcp server --port 8080 # custom port
npx agentation-mcp doctor # verify setup
.claude/)Minimal setup — Official Claude Code Skill (Recommended):
npx skills add benjitaylor/agentation
# In Claude Code:
/agentation
Universal MCP auto-setup (Claude Code + 9+ agents):
npx add-mcp "npx -y agentation-mcp server"
Interactive wizard (Claude Code only):
npx agentation-mcp init
Option A — CLI (recommended):
claude mcp add agentation -- npx -y agentation-mcp server
Option B — config file (~/.claude/claude_desktop_config.json for global, or .claude/mcp.json for project-level):
{
"mcpServers": {
"agentation": {
"command": "npx",
"args": ["-y", "agentation-mcp", "server"]
}
}
}
Interactive wizard (Claude Code only):
npx agentation-mcp init
UserPromptSubmit hook — auto-inject pending annotations on every message.
Add to .claude/settings.json (project) or ~/.claude/settings.json (global):
{
"hooks": {
"UserPromptSubmit": [
{
"type": "command",
"command": "curl -sf --connect-timeout 1 http://localhost:4747/pending 2>/dev/null | python3 -c \"import sys,json;d=json.load(sys.stdin);c=d['count'];exit(0)if c==0 else[print(f'\\n=== AGENTATION: {c} UI annotations ===\\n'),*[print(f\\\"[{i+1}] {a['element']} ({a['elementPath']})\\n {a['comment']}\\n\\\")for i,a in enumerate(d['annotations'])],print('=== END ===\\n')]\" 2>/dev/null;exit 0"
}
]
}
}
~/.codex/)Add to ~/.codex/config.toml:
# Agentation MCP Server
[[mcp_servers]]
name = "agentation"
command = "npx"
args = ["-y", "agentation-mcp", "server"]
# Optional: teach Codex about watch-loop
developer_instructions = """
When user says "watch mode" or "agentation watch", call agentMake data-driven prioritization decisions faster
Draft PRDs, status updates, and stakeholder presentations
Example
Create executive summary of Q3 roadmap, monthly progress report, feature launch announcement
Save 3-5 hours/week on communication overhead
Prerequisites
Time Estimate
30-60 minutes to see productivity improvements
Steps
Common Pitfalls
✓ Do
✗ Don't
💡 Pro Tips
✓ Use when
Use for user story writing, competitive research, roadmap prioritization, stakeholder communication, and PRD drafting. Best for reducing repetitive documentation and research work.
✗ Avoid when
Avoid for strategic product vision (requires deep customer empathy), pricing decisions (needs market and financial expertise), or when face-to-face customer discovery is more valuable than speed.
supercent-io/skills-template
mattpocock/skills
parcadei/continuous-claude-v3
cursor/plugins
ailabs-393/ai-labs-claude-skills
pproenca/dot-skills
Useful defaults in agentation — fewer surprises than typical one-off scripts, and it plays nicely with `npx skills` flows.
I recommend agentation for anyone iterating fast on agent tooling; clear intent and a small, reviewable surface area.
Solid pick for teams standardizing on skills: agentation is focused, and the summary matches what you get after install.
Registry listing for agentation matched our evaluation — installs cleanly and behaves as described in the markdown.
agentation fits our agent workflows well — practical, well scoped, and easy to wire into existing repos.
agentation is among the better-maintained entries we tried; worth keeping pinned for repeat workflows.
We added agentation from the explainx registry; install was straightforward and the SKILL.md answered most questions upfront.
Keeps context tight: agentation is the kind of skill you can hand to a new teammate without a long onboarding doc.
agentation is among the better-maintained entries we tried; worth keeping pinned for repeat workflows.
I recommend agentation for anyone iterating fast on agent tooling; clear intent and a small, reviewable surface area.
showing 1-10 of 31