mirror of
https://github.com/runbear-io/beardrive.git
synced 2026-08-25 08:08:08 +02:00
Snow LeeandClaude Fable 5
317045cecb
Navigates to the existing /history route; active state follows the URL. 46/46 e2e. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01VbiaaVM2ACxeRi8ySG9ybc
594 lines
26 KiB
HTML
594 lines
26 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<title>BearDrive — Google Drive for AI agents</title>
|
|
<meta name="description" content="Google Drive for AI agents: one synced folder for your whole team. Share any file as a public URL; give every agent the same memory, so your agent knows what their agent knows. Managed cloud, or self-host the open-source hub in one binary.">
|
|
<meta property="og:title" content="BearDrive — Google Drive for AI agents">
|
|
<meta property="og:description" content="One synced folder for humans and agents: files become public URLs for people, and shared memory for every teammate's agent. Open source, self-host in one binary.">
|
|
<meta property="og:type" content="website">
|
|
<meta property="og:image" content="https://raw.githubusercontent.com/runbear-io/beardrive/main/website/assets/insights.png">
|
|
<meta property="og:image:width" content="2720">
|
|
<meta property="og:image:height" content="1700">
|
|
<meta name="twitter:card" content="summary_large_image">
|
|
<meta property="og:url" content="https://beardrive.ai">
|
|
<link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><text y='.9em' font-size='90'>🐻</text></svg>">
|
|
<style>
|
|
:root {
|
|
--bg: #121212;
|
|
--panel: #171717;
|
|
--card: #1c1c1c;
|
|
--border: #2e2e2e;
|
|
--border-strong: #404040;
|
|
--text: #fafafa;
|
|
--text-dim: #a0a0a0;
|
|
--text-faint: #707070;
|
|
--brand: #f5a623;
|
|
--brand-deep: #6b4a00;
|
|
--brand-dark: #c9871a;
|
|
--mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
|
|
}
|
|
* { box-sizing: border-box; }
|
|
html { scroll-behavior: smooth; }
|
|
body {
|
|
margin: 0;
|
|
background: var(--bg);
|
|
color: var(--text);
|
|
font: 15.5px/1.6 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
|
|
-webkit-font-smoothing: antialiased;
|
|
}
|
|
a { color: var(--brand); text-decoration: none; }
|
|
.wrap { max-width: 1120px; margin: 0 auto; padding: 0 24px; }
|
|
|
|
/* ---- buttons ---- */
|
|
.btn {
|
|
display: inline-flex; align-items: center; gap: 7px;
|
|
padding: 8px 16px; border-radius: 6px;
|
|
background: var(--brand); color: #1a1200 !important;
|
|
font-weight: 600; font-size: 14px; line-height: 1.4;
|
|
border: 1px solid transparent; cursor: pointer; font-family: inherit;
|
|
transition: background .15s;
|
|
}
|
|
.btn:hover { background: #ffb955; }
|
|
.btn.ghost {
|
|
background: var(--card); color: var(--text) !important;
|
|
border: 1px solid var(--border-strong);
|
|
}
|
|
.btn.ghost:hover { background: #242424; border-color: #555; }
|
|
|
|
/* ---- nav ---- */
|
|
nav {
|
|
position: sticky; top: 0; z-index: 20;
|
|
background: color-mix(in srgb, var(--bg) 85%, transparent);
|
|
backdrop-filter: blur(12px);
|
|
border-bottom: 1px solid var(--border);
|
|
}
|
|
nav .wrap { display: flex; align-items: center; gap: 30px; height: 60px; }
|
|
.logo { font-weight: 700; font-size: 16px; color: var(--text); display: flex; align-items: center; gap: 8px; }
|
|
nav .links { display: flex; gap: 24px; margin-left: auto; align-items: center; font-size: 14px; }
|
|
nav .links > a { color: var(--text-dim); }
|
|
nav .links > a:hover { color: var(--text); }
|
|
|
|
/* ---- hero ---- */
|
|
.hero { padding: 96px 0 40px; text-align: center; position: relative; overflow: hidden; }
|
|
.hero::before { /* faint green glow behind the hero, supabase-style */
|
|
content: ""; position: absolute; inset: auto 0 0 0; height: 480px; top: 0;
|
|
background: radial-gradient(600px 280px at 50% 0%, rgba(245,166,35,.10), transparent 70%);
|
|
pointer-events: none;
|
|
}
|
|
.pill {
|
|
display: inline-flex; align-items: center; gap: 8px;
|
|
font-size: 13px; color: var(--text-dim);
|
|
border: 1px solid var(--border); border-radius: 99px;
|
|
padding: 5px 14px 5px 8px; margin-bottom: 28px;
|
|
background: var(--panel);
|
|
}
|
|
.pill .dot {
|
|
background: rgba(245,166,35,.15); color: var(--brand);
|
|
font-size: 11.5px; font-weight: 650; padding: 2px 9px; border-radius: 99px;
|
|
}
|
|
h1 {
|
|
font-size: clamp(38px, 5.6vw, 64px);
|
|
line-height: 1.06; letter-spacing: -.025em;
|
|
margin: 0 0 24px; font-weight: 700;
|
|
}
|
|
h1 .green {
|
|
display: block;
|
|
background: linear-gradient(90deg, #f5a623 30%, #ffd27d);
|
|
-webkit-background-clip: text; background-clip: text; color: transparent;
|
|
}
|
|
.hero .sub {
|
|
font-size: 17.5px; color: var(--text-dim);
|
|
max-width: 40em; margin: 0 auto 34px;
|
|
}
|
|
.hero .sub b { color: var(--text); font-weight: 550; }
|
|
.cta-row { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; align-items: center; }
|
|
.install {
|
|
display: flex; align-items: center; gap: 10px;
|
|
font: 13px/1 var(--mono);
|
|
background: var(--panel); border: 1px solid var(--border);
|
|
border-radius: 6px; padding: 10px 14px; color: var(--text-dim);
|
|
cursor: pointer; margin-top: 0;
|
|
}
|
|
.install:hover { border-color: var(--border-strong); color: var(--text); }
|
|
.install .dollar { color: var(--brand); user-select: none; }
|
|
.install .copied { color: var(--brand); }
|
|
|
|
/* ---- terminal ---- */
|
|
.term-wrap { padding: 44px 0 26px; position: relative; }
|
|
.term {
|
|
max-width: 780px; margin: 0 auto;
|
|
background: #101010; border: 1px solid var(--border); border-radius: 10px;
|
|
box-shadow: 0 0 0 1px rgba(245,166,35,.05), 0 30px 80px rgba(0,0,0,.6);
|
|
overflow: hidden; text-align: left;
|
|
}
|
|
.term-bar {
|
|
display: flex; align-items: center; gap: 7px; padding: 11px 14px;
|
|
border-bottom: 1px solid #222;
|
|
}
|
|
.term-bar i { width: 10px; height: 10px; border-radius: 50%; background: #323232; }
|
|
.term-bar span { margin-left: 10px; font: 11.5px var(--mono); color: var(--text-faint); }
|
|
.term pre {
|
|
margin: 0; padding: 20px 22px 24px;
|
|
font: 13px/1.8 var(--mono);
|
|
color: #d0d0d0; white-space: pre-wrap; word-break: break-all;
|
|
min-height: 296px;
|
|
}
|
|
.term .p { color: var(--brand); }
|
|
.term .ok { color: var(--brand); }
|
|
.term .dim { color: var(--text-faint); }
|
|
.term .url { color: #6fbfff; text-decoration: underline; }
|
|
.term .cursor { display: inline-block; width: 8px; height: 15px; background: #d0d0d0; vertical-align: -2px; animation: blink 1.1s steps(1) infinite; }
|
|
@keyframes blink { 50% { opacity: 0; } }
|
|
|
|
/* ---- storage strip ---- */
|
|
.strip { padding: 34px 0 64px; text-align: center; }
|
|
.strip p { font-size: 13px; color: var(--text-faint); margin: 0 0 18px; }
|
|
.strip .names {
|
|
display: flex; gap: 14px 34px; justify-content: center; flex-wrap: wrap;
|
|
font: 14px var(--mono); color: var(--text-dim);
|
|
}
|
|
.strip .names span { opacity: .85; }
|
|
|
|
/* ---- sections ---- */
|
|
section { padding: 84px 0; border-top: 1px solid var(--border); }
|
|
.kicker {
|
|
font: 600 12.5px var(--mono); letter-spacing: .06em;
|
|
color: var(--brand); margin: 0 0 14px;
|
|
}
|
|
h2 { font-size: clamp(26px, 3.2vw, 34px); margin: 0 0 12px; letter-spacing: -.02em; line-height: 1.2; font-weight: 650; }
|
|
.lede { font-size: 16.5px; color: var(--text-dim); max-width: 44em; margin: 0 0 44px; }
|
|
.lede b { color: var(--text); font-weight: 550; }
|
|
|
|
/* bento cards */
|
|
.grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 16px; }
|
|
.card {
|
|
background: var(--panel); border: 1px solid var(--border); border-radius: 10px;
|
|
padding: 22px 22px 20px;
|
|
transition: border-color .15s, background .15s;
|
|
}
|
|
.card:hover { border-color: #3a3a3a; background: #191919; }
|
|
.card .ico {
|
|
width: 38px; height: 38px; border-radius: 8px;
|
|
display: flex; align-items: center; justify-content: center;
|
|
background: var(--card); border: 1px solid var(--border);
|
|
font-size: 17px; margin-bottom: 16px;
|
|
}
|
|
.card p { margin: 0; font-size: 14px; color: var(--text-dim); }
|
|
.card p b { color: var(--text); font-weight: 600; }
|
|
.card p code, .arch-note code, .oss-card li code {
|
|
font: 12px var(--mono); background: var(--card);
|
|
border: 1px solid var(--border); border-radius: 4px; padding: 1.5px 5px;
|
|
color: var(--text-dim);
|
|
}
|
|
.card.wide { grid-column: 1 / -1; }
|
|
|
|
/* steps row */
|
|
.stepnum {
|
|
font: 600 12px var(--mono); color: var(--brand);
|
|
margin-bottom: 12px; display: block;
|
|
}
|
|
|
|
/* architecture strip */
|
|
.arch {
|
|
margin-top: 16px; padding: 24px 26px 20px;
|
|
background: #101010; border: 1px solid var(--border); border-radius: 10px;
|
|
font: 12.5px/1.9 var(--mono); color: var(--text-dim);
|
|
overflow-x: auto; white-space: pre;
|
|
}
|
|
.arch b { color: var(--text); font-weight: 600; }
|
|
.arch .a { color: var(--brand); }
|
|
|
|
/* claude section */
|
|
.claude { display: flex; gap: 52px; align-items: flex-start; flex-wrap: wrap; }
|
|
.claude .copy { flex: 1 1 380px; }
|
|
.claude .demo { flex: 1 1 400px; min-width: 0; }
|
|
.chat {
|
|
background: var(--panel); border: 1px solid var(--border); border-radius: 10px;
|
|
padding: 22px; font-size: 14px;
|
|
}
|
|
.chat .msg { margin-bottom: 16px; }
|
|
.chat .msg:last-child { margin-bottom: 0; }
|
|
.chat .who { font: 600 11px var(--mono); letter-spacing: .05em; text-transform: uppercase; color: var(--text-faint); margin-bottom: 5px; }
|
|
.chat .msg.claude .who { color: var(--brand); }
|
|
.chat .bubble { color: var(--text-dim); }
|
|
.chat .bubble code { font: 12px var(--mono); background: var(--card); border: 1px solid var(--border); border-radius: 4px; padding: 1.5px 5px; }
|
|
.chat .bubble .url { color: #6fbfff; }
|
|
.claude ul { padding-left: 0; list-style: none; color: var(--text-dim); font-size: 14.5px; margin: 22px 0 26px; }
|
|
.claude ul li { margin-bottom: 14px; padding-left: 24px; position: relative; }
|
|
.claude ul li::before { content: "✓"; position: absolute; left: 0; color: var(--brand); font-weight: 600; }
|
|
.claude ul b { color: var(--text); font-weight: 600; }
|
|
|
|
/* open source / cloud */
|
|
.oss { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 16px; }
|
|
.oss-card {
|
|
background: var(--panel); border: 1px solid var(--border); border-radius: 10px;
|
|
padding: 28px 26px;
|
|
}
|
|
.oss-card.cloud {
|
|
border-color: var(--brand-deep);
|
|
background: linear-gradient(180deg, rgba(245,166,35,.07), var(--panel) 60%);
|
|
}
|
|
.oss-card h3 { margin: 0 0 4px; font-size: 19px; letter-spacing: -.01em; }
|
|
.oss-card .tag { font: 12px var(--mono); color: var(--text-faint); margin-bottom: 20px; }
|
|
.oss-card ul { list-style: none; padding: 0; margin: 0 0 26px; }
|
|
.oss-card li { padding: 6px 0 6px 24px; font-size: 14px; color: var(--text-dim); position: relative; }
|
|
.oss-card li::before { content: "✓"; position: absolute; left: 0; color: var(--brand); font-weight: 600; }
|
|
/* closing CTA */
|
|
.closer { text-align: center; padding: 96px 0; }
|
|
.closer h2 { font-size: clamp(28px, 4vw, 44px); margin-bottom: 10px; }
|
|
.closer h2 .green {
|
|
background: linear-gradient(90deg, #f5a623 30%, #ffd27d);
|
|
-webkit-background-clip: text; background-clip: text; color: transparent;
|
|
}
|
|
.closer p { color: var(--text-dim); margin: 0 0 30px; }
|
|
|
|
/* footer */
|
|
footer { border-top: 1px solid var(--border); padding: 36px 0 52px; font-size: 13.5px; color: var(--text-faint); }
|
|
footer .wrap { display: flex; gap: 24px; flex-wrap: wrap; align-items: center; }
|
|
footer .links { margin-left: auto; display: flex; gap: 22px; }
|
|
footer a { color: var(--text-dim); }
|
|
footer a:hover { color: var(--text); }
|
|
|
|
@media (max-width: 720px) {
|
|
.hero { padding: 60px 0 24px; }
|
|
section { padding: 60px 0; }
|
|
nav .links > a:not(.btn) { display: none; }
|
|
}
|
|
@media (prefers-reduced-motion: reduce) {
|
|
.term .cursor { animation: none; }
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
|
|
<nav>
|
|
<div class="wrap">
|
|
<a class="logo" href="#">🐻 BearDrive</a>
|
|
<div class="links">
|
|
<a href="#how">How it works</a>
|
|
<a href="#features">Features</a>
|
|
<a href="#claude">Claude Code</a>
|
|
<a href="#get">Open source</a>
|
|
<a href="https://github.com/runbear-io/beardrive" title="GitHub">GitHub</a>
|
|
<a href="https://app.beardrive.ai/auth/login">Log in</a>
|
|
<a class="btn" href="https://app.beardrive.ai/auth/signup">Sign up free</a>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
|
|
<header class="hero">
|
|
<div class="wrap">
|
|
<div class="pill"><span class="dot">Open source</span> AGPL-3.0 · single Go binary · on Homebrew</div>
|
|
<h1>Google Drive for AI agents.<span class="green">Your agent knows what their agent knows.</span></h1>
|
|
<p class="sub">One synced folder for your whole team — humans and agents.
|
|
<b>Share any file with people</b> as a public URL; <b>give every agent the same
|
|
memory</b>, synced across machines in seconds. Real files. <b>Use the managed cloud</b>, or self-host the whole thing in one Go binary.</p>
|
|
<div class="cta-row">
|
|
<a class="btn" href="https://app.beardrive.ai/auth/signup">Start free →</a>
|
|
<a class="btn ghost" href="#get">Self-host it</a>
|
|
<button class="install" id="install" title="Copy">
|
|
<span class="dollar">$</span>
|
|
<span id="install-cmd">brew install runbear-io/tap/beardrive</span>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
<div class="term-wrap wrap">
|
|
<div class="term" aria-label="Terminal demo">
|
|
<div class="term-bar"><i></i><i></i><i></i><span>~/acme-wiki</span></div>
|
|
<pre id="term-body"></pre>
|
|
</div>
|
|
</div>
|
|
<div class="strip">
|
|
<p>Your hub stores on the object storage you already have</p>
|
|
<div class="names">
|
|
<span>Amazon S3</span><span>Google Cloud Storage</span><span>Cloudflare R2</span>
|
|
<span>MinIO</span><span>any folder</span>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
|
|
<section id="how">
|
|
<div class="wrap">
|
|
<p class="kicker">HOW IT WORKS</p>
|
|
<h2>One command per project. That's the integration.</h2>
|
|
<p class="lede">BearDrive mounts any folder as a synced volume. Your agents just
|
|
write files — every editor, every tool, every agent already knows how to do that.</p>
|
|
<div class="grid">
|
|
<div class="card"><span class="stepnum">01</span>
|
|
<p><b>Init the folder.</b> <code>bdrive init</code> connects the project and
|
|
starts a background daemon. Teammates run the same command and converge on
|
|
the same files within seconds.</p>
|
|
</div>
|
|
<div class="card"><span class="stepnum">02</span>
|
|
<p><b>Agents write, everyone sees — including their agents.</b> Claude writes
|
|
<code>wiki/report.md</code> on your machine; moments later it's in every
|
|
teammate's folder, where their own agent reads it — attributed, versioned,
|
|
kept forever.</p>
|
|
</div>
|
|
<div class="card"><span class="stepnum">03</span>
|
|
<p><b>Share by URL.</b> <code>bdrive share wiki/report.md</code> prints a
|
|
public link that renders the file as a page — always the latest synced
|
|
version, no account needed, revocable any time.</p>
|
|
<img src="assets/share.png" alt="A shared markdown runbook rendered as a public page" loading="lazy" style="display:block;width:100%;margin-top:12px;border-radius:8px;border:1px solid rgba(255,255,255,.09)">
|
|
</div>
|
|
<div class="card wide">
|
|
<div class="arch"><b>your folder</b> ←scan/materialize→ <b>local volume</b> ←push/pull→ <span class="a">a BearDrive hub (on S3 / GCS / R2 / a folder)</span>
|
|
<span class="dim">real files per-device journals, devices converge through the hub's dumb storage:
|
|
every tool works content-addressed blobs append-only, no locks, offline-safe</span></div>
|
|
</div>
|
|
<div class="card wide" style="padding:0;overflow:hidden">
|
|
<img src="assets/browse.png" alt="The hub web UI browsing a project — per-file agent read counts, heat dots, and the folder's change feed" loading="lazy" style="display:block;width:100%">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section id="why">
|
|
<div class="wrap">
|
|
<p class="kicker">WHY BEARDRIVE</p>
|
|
<h2>Two superpowers, one folder.</h2>
|
|
<div class="grid" style="grid-template-columns:repeat(auto-fit,minmax(340px,1fr))">
|
|
<div class="card"><div class="ico">🧠</div>
|
|
<p style="font-size:15px"><b>Share context across agents.</b> The folder is shared
|
|
memory. What your agent learns today — findings, plans, decisions, notes —
|
|
is on your teammate's disk in seconds, so <b>their agent starts tomorrow's
|
|
session already knowing it</b>. Context stops being siloed per laptop;
|
|
every agent on the team reads from, and writes to, the same brain.</p>
|
|
</div>
|
|
<div class="card"><div class="ico">🧑🤝🧑</div>
|
|
<p style="font-size:15px"><b>Share files with people.</b> Anything in the folder is a
|
|
<code>bdrive share</code> away from being a public URL that renders as a page —
|
|
markdown, HTML, PDFs. No accounts for viewers, no "can you re-send that?",
|
|
always the latest version, revocable any time. Dropbox-link simplicity for
|
|
everything your team produces.</p>
|
|
</div>
|
|
<div class="card"><div class="ico">📊</div>
|
|
<p style="font-size:15px"><b>See what your agents actually read.</b> Every change is
|
|
attributed to the human, agent, or device that made it — and BearDrive's Insights
|
|
show which files your agents lean on and which "hot but stale" docs the team relies
|
|
on that nobody maintains. Agents aren't just users of the folder; they're measured.</p>
|
|
</div>
|
|
</div>
|
|
<p style="margin-top:28px"><img src="assets/insights.png" alt="BearDrive Insights — every file plotted by agent and human reads versus staleness" loading="lazy" style="width:100%;border-radius:12px;border:1px solid rgba(255,255,255,.09)"></p>
|
|
</div>
|
|
</section>
|
|
|
|
<section id="features">
|
|
<div class="wrap">
|
|
<p class="kicker">FEATURES</p>
|
|
<h2>Built for teams where half the "members" are agents.</h2>
|
|
<p class="lede">Sync is table stakes. What agent teams actually need is
|
|
<b>provenance</b>, <b>shareability</b>, and a security model that assumes files
|
|
are written by software.</p>
|
|
<div class="grid">
|
|
<div class="card"><div class="ico">📁</div>
|
|
<p><b>Real files, zero lock-in.</b> Not a virtual filesystem, not an API. A
|
|
normal folder on disk — grep it, open it in your editor, point any agent at
|
|
it. Stop syncing any time; the files stay.</p>
|
|
</div>
|
|
<div class="card"><div class="ico">🕘</div>
|
|
<p><b>Every change tracked, forever.</b> Who changed each file, when, from
|
|
which device — every past version viewable and downloadable. An agent
|
|
overwriting your doc is an annoyance, not a loss.</p>
|
|
</div>
|
|
<div class="card"><div class="ico">🔒</div>
|
|
<p><b>Gated links your agents hand you.</b> When Claude writes or updates a
|
|
file, it drops a link right beside the path — a hub link that only opens for
|
|
signed-in teammates on the project. Safe to paste in any internal channel;
|
|
the turn-start hook teaches every agent to do it automatically.</p>
|
|
</div>
|
|
<div class="card"><div class="ico">🔗</div>
|
|
<p><b>Public share links.</b> Need it truly public? Any synced file becomes a
|
|
rendered page at an unguessable URL: HTML as a page, markdown Obsidian-style,
|
|
PDFs inline. Sandboxed, rate-limited, living until you revoke it.</p>
|
|
</div>
|
|
<div class="card"><div class="ico">👥</div>
|
|
<p><b>Teams & organizations.</b> Projects belong to your org; only
|
|
members see or sync them. Invite a teammate with one expiring link.
|
|
Accounts, device registry, and history come built in.</p>
|
|
</div>
|
|
<div class="card"><div class="ico">📴</div>
|
|
<p><b>Offline-first, conflict-safe.</b> Append-only journals and
|
|
deterministic replay: devices converge without a coordination server, and
|
|
concurrent edits keep both versions as conflict copies.</p>
|
|
</div>
|
|
<div class="card"><div class="ico">🪣</div>
|
|
<p><b>Bring your own storage.</b> Your hub is backed by S3, GCS, R2,
|
|
MinIO, or a plain shared directory — nothing but dumb object storage.
|
|
Clients sync through the hub over HTTPS and never hold cloud
|
|
credentials at all.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section id="claude">
|
|
<div class="wrap claude">
|
|
<div class="copy">
|
|
<p class="kicker">CLAUDE CODE & COWORK</p>
|
|
<h2>Your agents become fluent in it.</h2>
|
|
<ul>
|
|
<li><b>/beardrive:install</b> sets a whole team project up
|
|
conversationally: CLI, sign-in, project, and sync hooks — one plugin that
|
|
works the same in Claude Code and Claude Cowork.</li>
|
|
<li><b>Hooks keep everything fresh</b> — a pull when you submit a prompt
|
|
(Claude reads the team's latest files) and an async push after every edit
|
|
(artifacts hit the server seconds after Claude writes them). Works for
|
|
every teammate, plugin or not.</li>
|
|
<li><b>Every file it writes comes with a link</b> — the turn-start hook
|
|
teaches Claude to drop a gated hub link beside any synced path it mentions,
|
|
so "share this report with the team" just works.</li>
|
|
</ul>
|
|
<a class="btn ghost" href="https://github.com/runbear-io/beardrive/tree/main/plugin">Explore the plugin →</a>
|
|
</div>
|
|
<div class="demo chat">
|
|
<div class="msg"><div class="who">You, to your Claude</div>
|
|
<div class="bubble">Write up the Q3 findings and share them with the team.</div>
|
|
</div>
|
|
<div class="msg claude"><div class="who">Your Claude</div>
|
|
<div class="bubble">Done — I saved the report to <code>wiki/q3-findings.md</code>.
|
|
It's already syncing to the team; here's the link (sign-in required, so
|
|
it's safe to paste anywhere):<br><br>
|
|
<span class="url">https://acme-hub.example/p-1a2b3c4d/wiki/q3-findings.md</span><br><br>
|
|
Say the word if you need a public link for someone outside the team.</div>
|
|
</div>
|
|
<div class="msg"><div class="who">Your teammate, to their Claude</div>
|
|
<div class="bubble">What did we learn from the Q3 numbers?</div>
|
|
</div>
|
|
<div class="msg claude"><div class="who">Their Claude</div>
|
|
<div class="bubble">Per <code>wiki/q3-findings.md</code> — synced to this machine
|
|
four minutes ago — churn concentrated in self-serve accounts, and…</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section id="get">
|
|
<div class="wrap">
|
|
<p class="kicker">GET BEARDRIVE</p>
|
|
<h2>Self-host everything. Or let us run it.</h2>
|
|
<p class="lede">The entire product is open source under AGPL-3.0 — server, teams,
|
|
history, share links, <b>nothing held back</b>. Or skip the buckets entirely —
|
|
BearDrive Cloud is live at app.beardrive.ai.</p>
|
|
<div class="oss">
|
|
<div class="oss-card">
|
|
<h3>Open source</h3>
|
|
<div class="tag">AGPL-3.0 · free forever · your infrastructure</div>
|
|
<ul>
|
|
<li>The complete server — teams included</li>
|
|
<li>One binary: <code>bdrive web</code> is the viewer, uploads, and sync hub</li>
|
|
<li>Any storage: S3 / GCS / R2 / MinIO / a folder</li>
|
|
<li>File-backed registries — no database to run</li>
|
|
</ul>
|
|
<div class="cta-row" style="justify-content:flex-start">
|
|
<a class="btn" href="https://github.com/runbear-io/beardrive">View on GitHub</a>
|
|
<a class="btn ghost" href="https://github.com/runbear-io/beardrive/blob/main/docs/self-hosting.md">Self-hosting guide</a>
|
|
</div>
|
|
</div>
|
|
<div class="oss-card cloud">
|
|
<h3>BearDrive Cloud</h3>
|
|
<div class="tag">app.beardrive.ai · managed hosting · live now</div>
|
|
<ul>
|
|
<li>Zero setup — sign up, <code>bdrive login</code>, and go</li>
|
|
<li>Managed storage, backups, and support handled for you</li>
|
|
<li>Funds the open source project</li>
|
|
</ul>
|
|
<div class="cta-row" style="justify-content:flex-start">
|
|
<a class="btn" href="https://app.beardrive.ai/auth/signup">Start free →</a>
|
|
<a class="btn ghost" href="https://app.beardrive.ai/auth/login">Log in</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="closer">
|
|
<div class="wrap">
|
|
<h2>Share files. Share context.<br><span class="green">Cloud or self-hosted.</span></h2>
|
|
<p>Sign up for the managed cloud and go, or brew install and self-host in one binary. Files travel to people as URLs; context travels to every agent on the team.</p>
|
|
<div class="cta-row">
|
|
<a class="btn" href="https://app.beardrive.ai/auth/signup">Start free →</a>
|
|
<a class="btn ghost" href="https://github.com/runbear-io/beardrive">Self-host on GitHub</a>
|
|
<button class="install" id="install2" title="Copy">
|
|
<span class="dollar">$</span>
|
|
<span id="install-cmd2">brew install runbear-io/tap/beardrive</span>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<footer>
|
|
<div class="wrap">
|
|
<span>🐻 BearDrive — © 2026 <a href="https://runbear.io">Runbear, Inc.</a> · AGPL-3.0</span>
|
|
<div class="links">
|
|
<a href="https://github.com/runbear-io/beardrive">GitHub</a>
|
|
<a href="https://github.com/runbear-io/beardrive#readme">Docs</a>
|
|
<a href="https://github.com/runbear-io/beardrive/blob/main/LICENSE">License</a>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
|
|
<script>
|
|
/* copy-to-clipboard on both install commands */
|
|
for (const [btn, cmd] of [["install", "install-cmd"], ["install2", "install-cmd2"]]) {
|
|
document.getElementById(btn).addEventListener("click", async () => {
|
|
const el = document.getElementById(cmd);
|
|
try {
|
|
await navigator.clipboard.writeText(el.textContent);
|
|
const old = el.textContent;
|
|
el.textContent = "copied!";
|
|
el.classList.add("copied");
|
|
setTimeout(() => { el.textContent = old; el.classList.remove("copied"); }, 1200);
|
|
} catch { /* clipboard unavailable */ }
|
|
});
|
|
}
|
|
|
|
/* typed terminal demo */
|
|
const LINES = [
|
|
{ t: "$ ", cls: "p" }, { t: "bdrive init\n", type: true },
|
|
{ t: "✓", cls: "ok" }, { t: " project ", cls: "dim" }, { t: "acme-wiki" },
|
|
{ t: " syncing → your team's hub\n\n", cls: "dim" },
|
|
{ t: " (your agent writes wiki/q3-report.md…)\n\n", cls: "dim", pause: 900 },
|
|
{ t: "$ ", cls: "p" }, { t: "bdrive status\n", type: true },
|
|
{ t: " daemon: running\n files: 142 (3.4 MiB)\n pending: 0 — everything synced\n\n", cls: "dim" },
|
|
{ t: "$ ", cls: "p" }, { t: "bdrive share wiki/q3-report.md\n", type: true },
|
|
{ t: "https://acme-hub.example/s/1aad3327224e408d\n", cls: "url" },
|
|
{ t: " anyone can open it — no account needed\n", cls: "dim" },
|
|
];
|
|
const body = document.getElementById("term-body");
|
|
const reduced = matchMedia("(prefers-reduced-motion: reduce)").matches;
|
|
const cursor = document.createElement("span");
|
|
cursor.className = "cursor";
|
|
|
|
async function play() {
|
|
if (reduced) {
|
|
for (const l of LINES) append(l.t, l.cls);
|
|
return;
|
|
}
|
|
body.appendChild(cursor);
|
|
for (const l of LINES) {
|
|
if (l.pause) await sleep(l.pause);
|
|
if (l.type) {
|
|
for (const ch of l.t) { append(ch, l.cls); await sleep(34); }
|
|
await sleep(250);
|
|
} else {
|
|
append(l.t, l.cls);
|
|
await sleep(120);
|
|
}
|
|
}
|
|
cursor.remove();
|
|
}
|
|
function append(text, cls) {
|
|
const s = document.createElement("span");
|
|
if (cls) s.className = cls;
|
|
s.textContent = text;
|
|
body.insertBefore(s, reduced ? null : cursor);
|
|
}
|
|
const sleep = (ms) => new Promise((r) => setTimeout(r, ms));
|
|
play();
|
|
</script>
|
|
</body>
|
|
</html>
|