OpenCode 是开源的 AI 编程智能体。其界面把「终端血统」写在脸上:Berkeley Mono 是唯一字体,从正文到标签全部等宽;主色是带红棕底调的暖近黑(#201d1d),文字是暖白(#fdfcfc),圆角一律 4px 的实用直角,间距严格按 8px 系统递进至 96px。适合开发者工具与命令行文化产品。
AI 与大模型现代极简
提示词模板
基础模板
Design a OpenCode-inspired interface. - Berkeley Mono as the sole typeface -- monospace everywhere, no sans-serif or serif voices; - Warm near-black primary (#201d1d) with reddish-brown undertone, not pure black; - Off-white text (#fdfcfc) with warm tint, not pure white; - Minimal 4px border radius throughout -- sharp, utilitarian corners; - 8px base spacing system scaling up to 96px. Colors: #201d1d, #fdfcfc, #9a9898, #302c2c with #007aff accent. Typography: - Background:.
变体提示词
📱 移动端
Design a mobile app with OpenCode aesthetics. Use OpenCode color identity with #007aff accents. Clean, touch-friendly, native feel.
💻 Web端
Design a web application with OpenCode style. Use OpenCode color identity with #007aff accents. Professional, responsive layout.
📊 仪表板
Design a dashboard with OpenCode design language. Use OpenCode color identity with #007aff accents. Data-rich, organized, clear hierarchy.
📄 落地页
Design a landing page with OpenCode visual identity. Use OpenCode color identity with #007aff accents. Compelling, conversion-focused.
使用示例
OpenCode 应用
Web 端Build a web app with OpenCode design language and #007aff color system.
OpenCode 仪表板
仪表板Create a dashboard using OpenCode style with data visualization and - Background: typography.
✅ 适合场景
- AI
- AI 编程与 Agent 工具
- 开发者平台的深色界面
❌ 不适合场景
- 面向非技术用户的产品
- 明亮纸质阅读站
DESIGN.md 文件
符合 design.md 开放格式的设计系统描述,可复制或下载后交给 AI 编程工具使用。