Getting it into your agent
One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.
git clone --depth 1 https://github.com/kok-o/koko-contextos-agentsWrote 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/rules/kok-o/koko-contextos-agents/architecture-diagrams)<a href="https://agentmods.dev/rules/kok-o/koko-contextos-agents/architecture-diagrams"><img src="https://agentmods.dev/badge/rules/kok-o/koko-contextos-agents/architecture-diagrams/github.svg" alt="Measured on agentmods" height="20"></a>Or the 80×15 button, for a site that already has a row of RSS and ATOM ones. Only the verdict fits; the numbers stay here.
<a href="https://agentmods.dev/rules/kok-o/koko-contextos-agents/architecture-diagrams"><img src="https://agentmods.dev/badge/rules/kok-o/koko-contextos-agents/architecture-diagrams.svg" alt="Reviewed on agentmods" width="80" 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.00032 | $0.01253 |
| Opus 5 | $0.00016 | $0.00626 |
| Sonnet 5 | $0.00006 | $0.00251 |
| Haiku 4.5 | $0.00003 | $0.00125 |
Grade A, and why
architecture-diagrams 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 5d 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 — 111 lines — stays where its author put it; the contents beside it link to each section on GitHub.
Skill: architecture-diagrams
architecture-diagrams
Overview
Visual architecture engineering skill inspired by tt-a1i/archify. Replaces static ASCII art and rigid default diagrams with crisp, self-contained SVG and responsive HTML diagrams featuring modern dark-mode palettes, pulse animations for event flows, and strict C4-model component boundaries.
When to Use
Activate whenever:
- Designing or explaining distributed systems, microservices, or full-stack architectures.
- Visualizing complex auth flows (OAuth2, PKCE), multi-step payment sagas, or CDC outbox data pipelines.
- User requests an architecture diagram, flow chart, sequence diagram, or visual system design.
Rules & Patterns
1. Diagram Types Supported
- System Landscape / C4 Container Diagram:
- Clients (Web, Mobile, Third-party) → API Gateway / CDN → Microservices / Serverless → Storage / Event Brokers.
- Sequence Flow Diagram:
- Step-by-step lifecycles with synchronous requests, asynchronous pub/sub events, and compensating transactions.
- Data Pipeline & Event-Driven Topology:
- Primary DB → Transactional Outbox → CDC (Debezium) → Kafka Topic → Consumers → Materialized Views.
2. Aesthetic & Visual Invariants
- Dark Theme by Default: Surface
#0B0F19, containers#1E293B, borders#334155, text#F8FAFC. - Semantic Component Accents:
- Client / Frontend: Sky Blue (
#38BDF8) - API Gateway / Router: Indigo (
#818CF8) - Business Services: Emerald Green (
#34D399) - Databases / Storage: Amber / Orange (
#F59E0B) - Message Brokers / Event Buses: Purple (
#A855F7)
- Client / Frontend: Sky Blue (
- Active Data-Flow Motion: Use subtle CSS
@keyframeson SVG stroke dashes (stroke-dasharray,stroke-dashoffset) to show active direction of messages and data streams.
Code Examples
Standalone Animated SVG Data-Flow Pattern
<svg viewBox="0 0 800 200" xmlns="http://www.w3.org/2000/svg" class="bg-slate-950 rounded-xl p-4 w-full">
<defs>
<style>
.flow-line { stroke: #38BDF8; stroke-width: 2; stroke-dasharray: 6,6; animation: flow 1.5s linear infinite; }
@keyframes flow { to { stroke-dashoffset: -12; } }
.box { fill: #1E293B; stroke: #334155; stroke-width: 1.5; rx: 8; }
.text-title { fill: #F8FAFC; font-family: sans-serif; font-size: 14px; font-weight: 600; }
.text-sub { fill: #94A3B8; font-family: monospace; font-size: 11px; }
</style>
</defs>
<!-- Client Node -->
<rect x="30" y="70" width="160" height="60" class="box" />
<text x="110" y="96" text-anchor="middle" class="text-title">Next.js Client</text>
<text x="110" y="114" text-anchor="middle" class="text-sub">React 19 / RSC</text>
<!-- Data Flow -->
<line x1="190" y1="100" x2="330" y2="100" class="flow-line" />
<!-- API Gateway -->
<rect x="330" y="70" width="160" height="60" class="box" />
<text x="410" y="96" text-anchor="middle" class="text-title">API Gateway</text>
<text x="410" y="114" text-anchor="middle" class="text-sub">Auth & Rate Limiting</text>
<!-- Flow to Database -->
<line x1="490" y1="100" x2="630" y2="100" class="flow-line" />
<!-- Database -->
<rect x="630" y="70" width="140" height="60" class="box" />
<text x="700" y="96" text-anchor="middle" class="text-title">PostgreSQL</text>
<text x="700" y="114" text-anchor="middle" class="text-sub">Prisma / Outbox</text>
</svg>
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.
- 5d ago First seen · 111 lines · 32 tokens per session scan A 59a0844b1f81
architecture-diagrams is a cursor rule published in the GitHub repository kok-o/koko-contextos-agents (2 stars, last pushed 6d ago), licensed MIT. It adds 32 tokens to every session and 1,253 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-09-05.
Other cursor rules, from other repositories
validate-contracts
Assert data shape consistency across system boundaries — live API responses against JSON Schema, key-set comparison across layers, data shape validation for migrations and exports. Catches silent data corruption before deploy.
hatch3r-resilience-patterns
Resilience patterns in user code — circuit breakers, retry with decorrelated jitter, timeouts with deadline propagation, idempotency keys, bulkheads, hedged requests.
hatch3r-contract-testing
Consumer-driven and spec-driven contract testing between services — Pact, Schemathesis, Dredd, pact-broker can-i-deploy gate.
hatch3r-auth-patterns
Authentication and authorization patterns for end-user apps — OAuth 2.1, OIDC, DPoP, JWT rotation, cookie security, RBAC vs ABAC vs ReBAC rubric.
hatch3r-enhancability
CQ9 Enhancability Quality measurement rule — feature-flag adoption on user-visible behavior, config externalization, API versioning + deprecation policy, forward-compat patterns, extension-point definition.
hatch3r-event-schema-evolution
Event and message schema evolution patterns for Kafka / Kinesis / Pub-Sub / event store — backward + forward + full compatibility modes, schema registry, consumer-side defaults.