// 制作说明
这个网站是如何构建的。
字体、配色、技术栈以及值得感谢的人。其余细节都在源码中 — github.com/skzv/ccmux-website.
// 字体
JetBrains MonoOFL正文、仪表盘和安装命令示例。IBM Plex MonoOFL首页 ASCII 标志、统计数字和终端提示符。
字体均通过 Google Fonts 加载。网站采用等宽字体；首页与文档使用一致的字体风格。
// 配色
Catppuccin Mocha — 与 ccmux TUI 使用相同的配色。颜色变量定义在 src/styles/global.css 中的 @theme .
bg
#1e1e2e页面背景mantle#181825卡片和代码块背景crust#11111b最深层背景surface0#313244边框surface1#45475a强调边框overlay0#6c7086次要文字overlay1#7f849c强调的次要文字text#cdd6f4正文文字subtext#a6adc8弱化文字mauve#cba6f7品牌主色与链接blue#89b4fa次要元素与网络green#a6e3a1活跃状态yellow#f9e2af警告与按键red#f38ba8删除线与错误peach#fab387移动设备与暖色元素teal#94e2d5技术元素强调色各区块的强调色
// 首页主视觉mauve品牌主色// 仪表盘green“活跃”的会话状态// 设备接力peach移动设备与暖色元素// 创建会话blue网络与远程设备// 对话teal历史回顾// 快捷键yellow警告与按键// 智能体red温暖的多智能体配色// 更多功能overlay0有意弱化的次要内容
// 技术栈
静态站点生成Astro v7（output: 'static'）样式Tailwind CSS v4，通过
@tailwindcss/vite 加载；无需配置文件，主题变量位于 @theme 中 global.css.内容文档采用 MDX 和 Astro 内容集合。托管Hetzner VPS，由 nginx 直接提供 dist/ 目录中的文件。生产环境无需 Node 进程。构建时的初始数据public/api/stats.json 已提交到仓库；在本地通过以下命令刷新： npm run refresh-seed.实时统计/api/stats.json 每 5 分钟通过以下脚本刷新： scripts/refresh-stats.py 由 VPS 上的 cron 运行。每次部署结束时也会同步刷新一次。视觉氛围纯 CSS：SVG 分形噪声叠层（不透明度 4.5%， mix-blend-mode: overlay）以及双层径向渐变背景。彩蛋输入 matrix 即可触发首页彩蛋，也可以点击页脚的 🟩。// 本站介绍的工具
// 致谢
Charm出色的 TUI 技术栈Tailscale + Mosh支撑跨设备连接的网络基础AnthropicClaude CodeBlink / Moshi实用的移动终端Catppuccin本站和 ccmux 使用的配色方案Astro + Tailwind让静态开发者工具网站的构建变得简单