clavitor/clavitor.com/templates/openclaw.tmpl

{{define "openclaw"}}
<div class="hero container">
    <p class="label accent mb-4">Integration Guide</p>
    <h1 class="mb-6"><span class="vaultname">clav<span class="n">itor</span></span> + OpenClaw</h1>
    <p class="lead mb-6">Your OpenClaw agent manages credentials, rotates API keys, and completes 2FA &mdash; all from a single MCP tool call. Personal data stays sealed behind your WebAuthn authenticator.</p>
</div>

<hr class="divider">

<div class="section container">
    <div class="grid-2">
        <div class="card alt">
            <span class="badge accent mb-4">What your agent sees</span>
            <h3 class="mb-3">Shared fields</h3>
            <p class="mb-4">Your agent reads these to authenticate, deploy, and automate.</p>
            <ul class="checklist">
                <li>API keys (GitHub, AWS, Stripe, OpenAI&hellip;)</li>
                <li>SSH host credentials</li>
                <li>Database connection strings</li>
                <li>TOTP seeds &mdash; live 2FA codes on demand</li>
                <li>Service account passwords</li>
            </ul>
        </div>
        <div class="card red">
            <span class="badge red mb-4">What your agent never sees</span>
            <h3 class="mb-3">Personal fields</h3>
            <p class="mb-4">Encrypted client-side with your WebAuthn authenticator. The server stores ciphertext. No key, no access.</p>
            <ul class="checklist red">
                <li>Credit card numbers &amp; CVV</li>
                <li>Passport &amp; government IDs</li>
                <li>Recovery codes &amp; seed phrases</li>
                <li>Social security numbers</li>
                <li>Bank account details</li>
            </ul>
        </div>
    </div>
</div>

<div class="section container">
    <h2 class="mb-4">Connect in 60 seconds</h2>

    <div class="card mb-6">
        <h3 class="mb-4">1. Install the ClawHub skill</h3>
        <div class="code-block">claw install clavitor</div>
    </div>

    <div class="card mb-6">
        <h3 class="mb-4">2. Configure your token</h3>
        <p class="mb-4">Create a token in the <span class="vaultname">clav<span class="n">itor</span></span> web UI, then set it in your OpenClaw config:</p>
        <div class="code-block"><pre>claw config set clavitor.url "http://localhost:1984/mcp"
claw config set clavitor.token "clavitor_your_token_here"</pre></div>
    </div>

    <div class="card mb-6">
        <h3 class="mb-4">3. Use it in your skills</h3>
        <div class="code-block"><pre># In any OpenClaw skill:
result = clavitor.get_credential("github")
totp   = clavitor.get_totp("aws")
keys   = clavitor.search_vault("ssh")</pre></div>
    </div>

    <div class="card mb-6" style="border-color:var(--border-gold)">
        <h3 class="mb-4">Using hosted <span class="vaultname">clav<span class="n">itor</span></span>?</h3>
        <p class="mb-4">Your MCP URL includes your unique vault identifier. You can find the exact URL in your <strong>Account Information</strong> page after signing up.</p>
        <p style="font-size:0.875rem;color:var(--muted)">It looks like: <code>https://clavitor.com/<em>your_vault_id</em>/mcp</code></p>
    </div>
</div>

<div class="section container">
    <h2 class="mb-4">You don&rsquo;t have to do anything</h2>
    <p class="lead mb-8">Once connected, your OpenClaw agent handles credentials automatically. It looks up what it needs, generates 2FA codes, and authenticates &mdash; you just describe what you want done.</p>

    <div class="grid-2 mb-6">
        <div class="card card-hover alt">
            <h3 class="mb-3">&ldquo;Deploy to production&rdquo;</h3>
            <p>Your agent looks up server credentials, SSH key, and any required API tokens &mdash; then does the deployment.</p>
            <div class="code-block mt-3" style="font-size:0.8125rem"><pre>get_credential("aws-production")
get_totp("aws")  →  283941 (expires in 22s)</pre></div>
        </div>
        <div class="card card-hover alt">
            <h3 class="mb-3">&ldquo;Log in to GitHub and check the CI&rdquo;</h3>
            <p>Your agent finds the credential, generates a live TOTP code, and completes the 2FA flow. No phone needed.</p>
            <div class="code-block mt-3" style="font-size:0.8125rem"><pre>get_credential("github")
get_totp("github")  →  847203 (expires in 14s)</pre></div>
        </div>
    </div>
    <div class="grid-3 mb-6">
        <div class="card card-hover">
            <h3 class="mb-3">&ldquo;Find my database credentials&rdquo;</h3>
            <p>Full-text search across all entries &mdash; titles, URLs, usernames, notes.</p>
            <div class="code-block mt-3" style="font-size:0.8125rem">search_vault("postgres")</div>
        </div>
        <div class="card card-hover">
            <h3 class="mb-3">&ldquo;What&rsquo;s expiring soon?&rdquo;</h3>
            <p>Check for credentials, cards, or documents expiring within any timeframe.</p>
            <div class="code-block mt-3" style="font-size:0.8125rem">check_expiring(30)</div>
        </div>
        <div class="card card-hover">
            <h3 class="mb-3">&ldquo;Show me everything&rdquo;</h3>
            <p>List all entries the agent has access to. Useful for inventory or onboarding.</p>
            <div class="code-block mt-3" style="font-size:0.8125rem">list_credentials()</div>
        </div>
    </div>

    <div class="grid-2">
        <div class="card card-hover alt">
            <h3 class="mb-3">&ldquo;Save this API key&rdquo;</h3>
            <p>Your agent stores new credentials, notes, and configuration directly in your vault. Sign up for a service, generate an API key &mdash; it saves it immediately.</p>
        </div>
        <div class="card card-hover alt">
            <h3 class="mb-3">&ldquo;Remember this for later&rdquo;</h3>
            <p>License keys, server configs, migration plans, recovery instructions &mdash; anything your agent needs to remember goes straight into your vault, encrypted and searchable.</p>
        </div>
    </div>
</div>

<div class="section container">
    <h2 class="mb-4">Multi-agent swarm support</h2>
    <p class="lead mb-8">Running a swarm of OpenClaw agents? Each gets its own API key.</p>
    <div class="grid-3">
        <div class="card card-hover">
            <h3 class="mb-3">Deploy agent</h3>
            <p>Its own API key for SSH keys, server creds, and API tokens</p>
        </div>
        <div class="card card-hover">
            <h3 class="mb-3">Billing agent</h3>
            <p>Its own API key for Stripe, payment gateways, and invoicing</p>
        </div>
        <div class="card card-hover">
            <h3 class="mb-3">Dev agent</h3>
            <p>Its own API key for GitHub, CI/CD, and database credentials</p>
        </div>
    </div>
</div>

<div class="section container">
    <h2 class="mb-4">Every access is logged</h2>
    <p class="lead mb-8">The audit log records which agent accessed which credential, when, and from where.</p>
    <div class="code-block"><pre><span class="comment">TIME                 ACTION  ENTRY               ACTOR</span>
2026-03-08 10:23:14  read    github.com          mcp:claw-deploy
2026-03-08 10:23:15  totp    github.com          mcp:claw-deploy
2026-03-08 11:45:02  read    aws-production      mcp:claw-billing
2026-03-08 14:12:33  search  "database"          mcp:claw-dev</pre></div>
</div>

<div class="section container" style="text-align:center">
    <h2 class="mb-4">Get started</h2>
    <div class="btn-row" style="justify-content:center">
        <a href="/install" class="btn btn-primary">Self-host (free)</a>
        <a href="/hosted" class="btn btn-gold">Hosted ($12/yr)</a>
    </div>
</div>
{{end}}