opencode.cafe — Community Marketplace for OpenCode

Code

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>opencode.cafe — Community Marketplace for OpenCode</title>
<style>
  :root {
    --bg: #0b0f17;
    --surface: #141a26;
    --surface-2: #1b2331;
    --text: #e6edf6;
    --muted: #8b97a8;
    --accent: #6ea8fe;
    --border: rgba(255, 255, 255, 0.08);
    --radius: 16px;
  }

  * { box-sizing: border-box; }

  html, body {
    margin: 0;
    padding: 0;
  }

  body {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    background: radial-gradient(1200px 600px at 50% -10%, #16203200, var(--bg)) , var(--bg);
    color: var(--text);
    font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    line-height: 1.55;
  }

  .card {
    width: 100%;
    max-width: 640px;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    padding: 32px;
    box-shadow: 0 20px 50px -20px rgba(0, 0, 0, 0.6);
  }

  .eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--accent);
    margin: 0 0 12px;
  }

  .eyebrow::before {
    content: "";
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--accent);
    box-shadow: 0 0 12px var(--accent);
  }

  h1 {
    margin: 0 0 12px;
    font-size: 26px;
    line-height: 1.25;
    letter-spacing: -0.01em;
  }

  .desc {
    margin: 0 0 24px;
    color: var(--muted);
    font-size: 15px;
  }

  h2 {
    margin: 24px 0 10px;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--muted);
  }

  pre {
    margin: 0;
    background: var(--surface-2);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 14px 16px;
    overflow-x: auto;
  }

  code {
    font-family: "SF Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
    font-size: 13px;
    color: var(--text);
  }

  .pills {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 10px 0 4px;
  }

  .pill {
    font-size: 12px;
    font-weight: 500;
    color: var(--text);
    background: var(--surface-2);
    border: 1px solid var(--border);
    border-radius: 999px;
    padding: 6px 12px;
  }

  .cta {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 28px;
    padding: 12px 20px;
    background: var(--accent);
    color: #0b0f17;
    font-weight: 600;
    font-size: 15px;
    text-decoration: none;
    border-radius: 10px;
    transition: transform 0.12s ease, box-shadow 0.12s ease;
  }

  .cta:hover {
    transform: translateY(-1px);
    box-shadow: 0 10px 24px -10px var(--accent);
  }

  .cta:focus-visible,
  pre:focus-visible {
    outline: 3px solid var(--accent);
    outline-offset: 3px;
  }

  .cta svg { width: 16px; height: 16px; }

  @media (max-width: 480px) {
    .card { padding: 24px; }
    h1 { font-size: 22px; }
  }
</style>
</head>
<body>
  <main class="card">
    <p class="eyebrow">OpenCode</p>
    <h1>opencode.cafe</h1>
    <p class="desc">
      A community-driven marketplace where developers discover, share, and install plugins,
      agents, and configurations for the OpenCode AI coding tool.
    </p>

    <h2>How to access</h2>
    <pre tabindex="0"><code># Browse the marketplace
https://www.opencode.cafe/

# New to OpenCode? Install the runtime first
curl -fsSL https://opencode.ai/install | bash</code></pre>

    <h2>Compatible with</h2>
    <div class="pills">
      <span class="pill">OpenCode</span>
      <span class="pill">MCP servers</span>
      <span class="pill">Custom agents</span>
      <span class="pill">Plugins</span>
    </div>

    <a class="cta" href="https://www.opencode.cafe/" target="_blank" rel="noopener">
      Visit opencode.cafe
      <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
           stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
        <path d="M7 17 17 7" />
        <path d="M7 7h10v10" />
      </svg>
    </a>
  </main>
</body>
</html>

What it is

opencode.cafe is a community marketplace for the OpenCode AI coding agent. It collects plugins, custom agents, and shareable configurations contributed by the community in one browsable place, so you can find and add extensions to your OpenCode setup without hunting across scattered repos.

Think of it as the discovery layer for the OpenCode ecosystem: a directory you visit to see what others have built, then pull into your own environment.

How to access / install

Browse the marketplace in your browser:

https://www.opencode.cafe/

Each listing points you to its source and tells you how to wire it into OpenCode. In general you configure plugins and agents through your OpenCode config (typically opencode.json / opencode.jsonc or the project-level .opencode/ directory) — follow the per-listing instructions, since each contribution documents its own setup.

If you are new to the runtime itself, install OpenCode first:

# install OpenCode (see opencode.ai for current instructions)
curl -fsSL https://opencode.ai/install | bash

Good for

Discovering community-built plugins and agents for OpenCode.
Sharing your own OpenCode extensions and configs with other developers.
Getting started faster with ready-made setups instead of building from scratch.