Hunter Bown
569 lines
17 KiB
HTML
569 lines
17 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>DeepSeek TUI — Terminal-native coding agent</title>
|
||
<link rel="alternate" hreflang="zh" href="./zh/">
|
||
<style>
|
||
:root {
|
||
--bg: #0a0e14;
|
||
--bg-elevated: #111820;
|
||
--bg-card: #0f151c;
|
||
--border: #1e2a36;
|
||
--border-light: #263545;
|
||
--text: #b8c5d6;
|
||
--text-muted: #5e7a94;
|
||
--text-bright: #e8f0f8;
|
||
--accent: #4dabf7;
|
||
--accent-dim: #1971c2;
|
||
--accent-glow: rgba(77, 171, 247, 0.15);
|
||
--success: #51cf66;
|
||
--warning: #ffd43b;
|
||
--font-mono: ui-monospace, "SF Mono", "SFMono-Regular", Menlo, Consolas, "Liberation Mono", monospace;
|
||
--font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
|
||
--font-zh: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
|
||
}
|
||
|
||
* { box-sizing: border-box; margin: 0; padding: 0; }
|
||
|
||
html { scroll-behavior: smooth; }
|
||
|
||
body {
|
||
background: var(--bg);
|
||
color: var(--text);
|
||
font-family: var(--font-sans);
|
||
line-height: 1.65;
|
||
-webkit-font-smoothing: antialiased;
|
||
}
|
||
|
||
/* Background grid */
|
||
body::before {
|
||
content: "";
|
||
position: fixed;
|
||
inset: 0;
|
||
background-image:
|
||
linear-gradient(rgba(77,171,247,0.03) 1px, transparent 1px),
|
||
linear-gradient(90deg, rgba(77,171,247,0.03) 1px, transparent 1px);
|
||
background-size: 60px 60px;
|
||
mask-image: radial-gradient(ellipse 80% 60% at 50% 0%, black 40%, transparent 100%);
|
||
pointer-events: none;
|
||
z-index: 0;
|
||
}
|
||
|
||
a { color: var(--accent); text-decoration: none; transition: color 0.15s; }
|
||
a:hover { color: #74c0fc; text-decoration: underline; }
|
||
|
||
.container {
|
||
max-width: 860px;
|
||
margin: 0 auto;
|
||
padding: 0 1.5rem;
|
||
position: relative;
|
||
z-index: 1;
|
||
}
|
||
|
||
/* Nav */
|
||
nav {
|
||
border-bottom: 1px solid var(--border);
|
||
background: rgba(10,14,20,0.75);
|
||
backdrop-filter: blur(12px) saturate(1.2);
|
||
position: sticky;
|
||
top: 0;
|
||
z-index: 20;
|
||
}
|
||
nav .container {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
height: 3.75rem;
|
||
}
|
||
.nav-brand {
|
||
font-weight: 700;
|
||
color: var(--text-bright);
|
||
font-family: var(--font-mono);
|
||
font-size: 0.95rem;
|
||
letter-spacing: -0.02em;
|
||
}
|
||
.nav-brand span { color: var(--accent); }
|
||
.nav-links {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 1.5rem;
|
||
list-style: none;
|
||
font-size: 0.875rem;
|
||
font-weight: 500;
|
||
}
|
||
.nav-links a { color: var(--text-muted); }
|
||
.nav-links a:hover { color: var(--text-bright); text-decoration: none; }
|
||
.lang-switch {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 0.35rem;
|
||
padding: 0.3rem 0.6rem;
|
||
border-radius: 6px;
|
||
border: 1px solid var(--border);
|
||
font-size: 0.8rem;
|
||
color: var(--text-muted);
|
||
transition: all 0.15s;
|
||
}
|
||
.lang-switch:hover {
|
||
border-color: var(--border-light);
|
||
color: var(--text-bright);
|
||
text-decoration: none;
|
||
}
|
||
|
||
/* Hero */
|
||
.hero {
|
||
padding: 5rem 0 3.5rem;
|
||
text-align: center;
|
||
}
|
||
.hero-badge {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
padding: 0.35rem 0.9rem;
|
||
border-radius: 999px;
|
||
border: 1px solid var(--border);
|
||
background: var(--bg-elevated);
|
||
font-size: 0.8rem;
|
||
color: var(--text-muted);
|
||
margin-bottom: 1.5rem;
|
||
}
|
||
.hero-badge .dot {
|
||
width: 7px;
|
||
height: 7px;
|
||
border-radius: 50%;
|
||
background: var(--success);
|
||
box-shadow: 0 0 8px rgba(81,207,102,0.4);
|
||
}
|
||
.hero h1 {
|
||
font-family: var(--font-mono);
|
||
font-size: clamp(1.7rem, 4.5vw, 2.6rem);
|
||
color: var(--text-bright);
|
||
line-height: 1.2;
|
||
margin-bottom: 1.25rem;
|
||
letter-spacing: -0.02em;
|
||
}
|
||
.hero h1 .accent {
|
||
background: linear-gradient(135deg, var(--accent) 0%, #74c0fc 100%);
|
||
-webkit-background-clip: text;
|
||
-webkit-text-fill-color: transparent;
|
||
background-clip: text;
|
||
}
|
||
.hero .lead {
|
||
font-size: 1.15rem;
|
||
color: var(--text-muted);
|
||
max-width: 560px;
|
||
margin: 0 auto 2.5rem;
|
||
line-height: 1.6;
|
||
}
|
||
|
||
/* Terminal window */
|
||
.terminal {
|
||
max-width: 540px;
|
||
margin: 0 auto 2rem;
|
||
border-radius: 12px;
|
||
border: 1px solid var(--border-light);
|
||
background: #060a10;
|
||
overflow: hidden;
|
||
box-shadow:
|
||
0 0 0 1px rgba(77,171,247,0.08),
|
||
0 20px 50px -10px rgba(0,0,0,0.5),
|
||
0 0 80px -20px var(--accent-glow);
|
||
}
|
||
.terminal-header {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
padding: 0.65rem 1rem;
|
||
background: rgba(255,255,255,0.02);
|
||
border-bottom: 1px solid var(--border);
|
||
}
|
||
.terminal-header .win-dot {
|
||
width: 11px;
|
||
height: 11px;
|
||
border-radius: 50%;
|
||
}
|
||
.win-dot.red { background: #ff5f56; }
|
||
.win-dot.yellow { background: #ffbd2e; }
|
||
.win-dot.green { background: #27c93f; }
|
||
.terminal-header .title {
|
||
margin-left: 0.5rem;
|
||
font-size: 0.75rem;
|
||
color: var(--text-muted);
|
||
font-family: var(--font-mono);
|
||
}
|
||
.terminal-body {
|
||
padding: 1.1rem 1.25rem;
|
||
font-family: var(--font-mono);
|
||
font-size: 0.95rem;
|
||
color: var(--text-bright);
|
||
text-align: left;
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.6rem;
|
||
}
|
||
.terminal-body .prompt { color: var(--success); }
|
||
.terminal-body .cursor {
|
||
display: inline-block;
|
||
width: 8px;
|
||
height: 1.15em;
|
||
background: var(--accent);
|
||
animation: blink 1s step-end infinite;
|
||
vertical-align: text-bottom;
|
||
margin-left: 2px;
|
||
}
|
||
@keyframes blink { 50% { opacity: 0; } }
|
||
.btn-copy {
|
||
margin-left: auto;
|
||
background: transparent;
|
||
color: var(--text-muted);
|
||
border: 1px solid var(--border);
|
||
border-radius: 6px;
|
||
padding: 0.3rem 0.7rem;
|
||
font-family: var(--font-sans);
|
||
font-size: 0.75rem;
|
||
font-weight: 600;
|
||
cursor: pointer;
|
||
transition: all 0.15s;
|
||
white-space: nowrap;
|
||
}
|
||
.btn-copy:hover {
|
||
border-color: var(--border-light);
|
||
color: var(--text-bright);
|
||
}
|
||
.btn-copy.copied {
|
||
border-color: var(--success);
|
||
color: var(--success);
|
||
}
|
||
|
||
.hero-actions {
|
||
display: flex;
|
||
gap: 0.75rem;
|
||
justify-content: center;
|
||
flex-wrap: wrap;
|
||
}
|
||
.btn {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 0.4rem;
|
||
padding: 0.6rem 1.2rem;
|
||
border-radius: 8px;
|
||
font-size: 0.9rem;
|
||
font-weight: 600;
|
||
transition: all 0.15s;
|
||
cursor: pointer;
|
||
border: none;
|
||
}
|
||
.btn-primary {
|
||
background: linear-gradient(135deg, var(--accent-dim) 0%, var(--accent) 100%);
|
||
color: #fff;
|
||
box-shadow: 0 4px 16px rgba(25,113,194,0.25);
|
||
}
|
||
.btn-primary:hover {
|
||
transform: translateY(-1px);
|
||
box-shadow: 0 6px 20px rgba(25,113,194,0.35);
|
||
text-decoration: none;
|
||
color: #fff;
|
||
}
|
||
.btn-secondary {
|
||
background: var(--bg-elevated);
|
||
color: var(--text);
|
||
border: 1px solid var(--border);
|
||
}
|
||
.btn-secondary:hover {
|
||
border-color: var(--border-light);
|
||
color: var(--text-bright);
|
||
text-decoration: none;
|
||
}
|
||
|
||
/* Screenshot */
|
||
.screenshot-wrap {
|
||
margin: 3rem 0;
|
||
border-radius: 14px;
|
||
overflow: hidden;
|
||
border: 1px solid var(--border);
|
||
background: var(--bg-card);
|
||
box-shadow: 0 30px 60px -20px rgba(0,0,0,0.6);
|
||
}
|
||
.screenshot-wrap img {
|
||
width: 100%;
|
||
height: auto;
|
||
display: block;
|
||
}
|
||
|
||
/* Sections */
|
||
section {
|
||
padding: 3rem 0;
|
||
border-top: 1px solid var(--border);
|
||
}
|
||
section h2 {
|
||
font-family: var(--font-mono);
|
||
font-size: 1.1rem;
|
||
color: var(--text-bright);
|
||
margin-bottom: 1.25rem;
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
}
|
||
section h2 .icon {
|
||
color: var(--accent);
|
||
}
|
||
section p, section li {
|
||
color: var(--text-muted);
|
||
font-size: 0.95rem;
|
||
margin-bottom: 0.75rem;
|
||
}
|
||
section ul { padding-left: 1.25rem; }
|
||
section li { margin-bottom: 0.5rem; }
|
||
section li strong { color: var(--text); font-weight: 600; }
|
||
|
||
pre {
|
||
background: #060a10;
|
||
border: 1px solid var(--border);
|
||
border-radius: 10px;
|
||
padding: 1rem 1.25rem;
|
||
overflow-x: auto;
|
||
font-family: var(--font-mono);
|
||
font-size: 0.82rem;
|
||
color: var(--text-bright);
|
||
margin: 0.75rem 0 1.25rem;
|
||
line-height: 1.6;
|
||
}
|
||
pre code { background: none; padding: 0; border: none; }
|
||
code {
|
||
font-family: var(--font-mono);
|
||
font-size: 0.88em;
|
||
background: var(--bg-elevated);
|
||
padding: 0.15rem 0.4rem;
|
||
border-radius: 4px;
|
||
border: 1px solid var(--border);
|
||
color: var(--text-bright);
|
||
}
|
||
|
||
/* Details / collapsible */
|
||
details {
|
||
background: var(--bg-card);
|
||
border: 1px solid var(--border);
|
||
border-radius: 10px;
|
||
padding: 1rem 1.25rem;
|
||
margin-bottom: 0.75rem;
|
||
}
|
||
summary {
|
||
font-weight: 600;
|
||
color: var(--text-bright);
|
||
cursor: pointer;
|
||
user-select: none;
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
font-size: 0.95rem;
|
||
}
|
||
summary::marker { display: none; }
|
||
details[open] summary { margin-bottom: 0.75rem; }
|
||
details pre { margin-bottom: 0; }
|
||
|
||
/* Feature grid */
|
||
.feature-grid {
|
||
display: grid;
|
||
grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
|
||
gap: 1rem;
|
||
margin-top: 1rem;
|
||
}
|
||
.feature-card {
|
||
background: var(--bg-card);
|
||
border: 1px solid var(--border);
|
||
border-radius: 10px;
|
||
padding: 1.25rem;
|
||
transition: border-color 0.15s, transform 0.15s;
|
||
}
|
||
.feature-card:hover {
|
||
border-color: var(--border-light);
|
||
transform: translateY(-2px);
|
||
}
|
||
.feature-card h3 {
|
||
font-size: 0.9rem;
|
||
color: var(--text-bright);
|
||
margin-bottom: 0.4rem;
|
||
font-family: var(--font-mono);
|
||
}
|
||
.feature-card p {
|
||
font-size: 0.85rem;
|
||
margin: 0;
|
||
line-height: 1.55;
|
||
}
|
||
|
||
/* Footer */
|
||
footer {
|
||
border-top: 1px solid var(--border);
|
||
padding: 2.5rem 0 3.5rem;
|
||
text-align: center;
|
||
font-size: 0.85rem;
|
||
color: var(--text-muted);
|
||
}
|
||
footer .footer-links {
|
||
display: flex;
|
||
gap: 1.25rem;
|
||
justify-content: center;
|
||
flex-wrap: wrap;
|
||
margin-bottom: 1.25rem;
|
||
font-weight: 500;
|
||
}
|
||
.disclaimer {
|
||
font-style: italic;
|
||
opacity: 0.7;
|
||
margin-top: 0.75rem;
|
||
}
|
||
|
||
@media (max-width: 640px) {
|
||
.hero { padding: 3rem 0 2.5rem; }
|
||
.nav-links { gap: 0.9rem; font-size: 0.8rem; }
|
||
.terminal-body { font-size: 0.85rem; flex-wrap: wrap; }
|
||
.feature-grid { grid-template-columns: 1fr; }
|
||
}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
|
||
<nav>
|
||
<div class="container">
|
||
<div class="nav-brand">deepseek<span>-tui</span></div>
|
||
<ul class="nav-links">
|
||
<li><a href="#install">Install</a></li>
|
||
<li><a href="https://github.com/Hmbown/CodeWhale" target="_blank" rel="noopener">GitHub</a></li>
|
||
<li><a href="https://github.com/Hmbown/CodeWhale/tree/main/docs" target="_blank" rel="noopener">Docs</a></li>
|
||
<li><a href="https://github.com/Hmbown/CodeWhale/issues" target="_blank" rel="noopener">Community</a></li>
|
||
<li><a href="./zh/" class="lang-switch" title="切换到简体中文">中</a></li>
|
||
</ul>
|
||
</div>
|
||
</nav>
|
||
|
||
<main class="container">
|
||
|
||
<div class="hero" id="install">
|
||
<div class="hero-badge"><span class="dot"></span>v0.8.10 available now</div>
|
||
<h1>A terminal-native coding agent<br>for <span class="accent">DeepSeek V4</span></h1>
|
||
<p class="lead">1M-token context. Thinking-mode streaming. Single binary, zero dependencies — ships an MCP client, sandbox, and durable task queue out of the box.</p>
|
||
|
||
<div class="terminal">
|
||
<div class="terminal-header">
|
||
<span class="win-dot red"></span>
|
||
<span class="win-dot yellow"></span>
|
||
<span class="win-dot green"></span>
|
||
<span class="title">bash — zsh</span>
|
||
</div>
|
||
<div class="terminal-body">
|
||
<span class="prompt">$</span>
|
||
<span>npm i -g deepseek-tui</span>
|
||
<span class="cursor"></span>
|
||
<button class="btn-copy" onclick="copyInstall()" id="copyBtn">Copy</button>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="hero-actions">
|
||
<a class="btn btn-primary" href="https://github.com/Hmbown/CodeWhale" target="_blank" rel="noopener">View on GitHub</a>
|
||
<a class="btn btn-secondary" href="https://github.com/sponsors/Hmbown" target="_blank" rel="noopener">Sponsor</a>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="screenshot-wrap">
|
||
<img src="https://raw.githubusercontent.com/Hmbown/CodeWhale/main/assets/screenshot.png" alt="DeepSeek TUI screenshot" loading="lazy">
|
||
</div>
|
||
|
||
<section>
|
||
<h2><span class="icon">▸</span>What you get</h2>
|
||
<div class="feature-grid">
|
||
<div class="feature-card">
|
||
<h3>1M context</h3>
|
||
<p>Built for DeepSeek V4 with intelligent compaction and prefix-cache-aware cost optimization.</p>
|
||
</div>
|
||
<div class="feature-card">
|
||
<h3>Thinking stream</h3>
|
||
<p>Watch the model's chain-of-thought unfold in real time before the final answer arrives.</p>
|
||
</div>
|
||
<div class="feature-card">
|
||
<h3>Native RLM</h3>
|
||
<p>Fan out 1–16 cheap children in parallel for batched analysis and parallel reasoning.</p>
|
||
</div>
|
||
<div class="feature-card">
|
||
<h3>Full tool suite</h3>
|
||
<p>File ops, shell, git, web search, apply-patch, sub-agents, and MCP servers.</p>
|
||
</div>
|
||
<div class="feature-card">
|
||
<h3>Three modes</h3>
|
||
<p>Plan (read-only), Agent (interactive), and YOLO (auto-approved) for any workflow.</p>
|
||
</div>
|
||
<div class="feature-card">
|
||
<h3>Durable sessions</h3>
|
||
<p>Save, resume, and rollback workspace state without touching your repo's .git.</p>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="china">
|
||
<h2><span class="icon">◎</span>China / mirror-friendly install</h2>
|
||
<p>If downloads from GitHub or npm are slow from mainland China, use one of these paths:</p>
|
||
|
||
<details open>
|
||
<summary>npm via 淘宝镜像 (fastest)</summary>
|
||
<pre><code>npm config set registry https://registry.npmmirror.com
|
||
npm install -g deepseek-tui</code></pre>
|
||
<p style="font-size:0.85rem;margin-bottom:0;">The npm wrapper itself will still download the binary from GitHub Releases during <code>postinstall</code>. If that step is slow, set a mirror for the binary download:</p>
|
||
<pre style="margin-top:0.5rem;margin-bottom:0;"><code>DEEPSEEK_TUI_RELEASE_BASE_URL=https://your-mirror.example.com \
|
||
npm install -g deepseek-tui</code></pre>
|
||
</details>
|
||
|
||
<details>
|
||
<summary>Cargo via 清华 TUNA mirror</summary>
|
||
<p>Add to <code>~/.cargo/config.toml</code>:</p>
|
||
<pre><code>[source.crates-io]
|
||
replace-with = "tuna"
|
||
|
||
[source.tuna]
|
||
registry = "sparse+https://mirrors.tuna.tsinghua.edu.cn/crates.io-index/"</code></pre>
|
||
<p>Then install both binaries:</p>
|
||
<pre><code>cargo install deepseek-tui-cli --locked # provides `deepseek`
|
||
cargo install deepseek-tui --locked # provides `deepseek-tui`
|
||
deepseek --version</code></pre>
|
||
</details>
|
||
|
||
<details>
|
||
<summary>Rustup mirror (for building from source)</summary>
|
||
<pre><code>export RUSTUP_DIST_SERVER=https://mirrors.tuna.tsinghua.edu.cn/rustup
|
||
export RUSTUP_UPDATE_ROOT=https://mirrors.tuna.tsinghua.edu.cn/rustup/rustup
|
||
curl --proto '=https' --tlsv1.2 -sSf https://sh.rustup.rs | sh</code></pre>
|
||
</details>
|
||
|
||
<p style="margin-top:1rem;font-size:0.875rem;">Full platform guide: <a href="https://github.com/Hmbown/CodeWhale/blob/main/docs/INSTALL.md" target="_blank" rel="noopener">docs/INSTALL.md</a> · <a href="../README.zh-CN.md">简体中文 README</a></p>
|
||
</section>
|
||
|
||
</main>
|
||
|
||
<footer>
|
||
<div class="container">
|
||
<div class="footer-links">
|
||
<a href="https://github.com/Hmbown/CodeWhale" target="_blank" rel="noopener">GitHub</a>
|
||
<a href="https://github.com/Hmbown/CodeWhale/tree/main/docs" target="_blank" rel="noopener">Docs</a>
|
||
<a href="https://github.com/Hmbown/CodeWhale/issues" target="_blank" rel="noopener">Issues</a>
|
||
<a href="https://github.com/sponsors/Hmbown" target="_blank" rel="noopener">Sponsor</a>
|
||
<a href="mailto:security@deepseek-tui.com">Security</a>
|
||
</div>
|
||
<p class="disclaimer">Not affiliated with DeepSeek Inc.</p>
|
||
<p style="margin-top:0.75rem;">© DeepSeek TUI contributors. MIT License.</p>
|
||
</div>
|
||
</footer>
|
||
|
||
<script>
|
||
function copyInstall() {
|
||
navigator.clipboard.writeText('npm i -g deepseek-tui').then(() => {
|
||
const btn = document.getElementById('copyBtn');
|
||
btn.textContent = 'Copied';
|
||
btn.classList.add('copied');
|
||
setTimeout(() => { btn.textContent = 'Copy'; btn.classList.remove('copied'); }, 1800);
|
||
});
|
||
}
|
||
</script>
|
||
|
||
</body>
|
||
</html>
|