Supabase 是以 Postgres 为核心的开源开发平台，一站式提供数据库、认证、即时 API、实时订阅、函数、存储与向量检索，被视作「开源版 Firebase」。其界面天生深色（#0f0f0f/#171717，绝不用纯黑），翠绿（#3ecf8e）只在身份标记处克制出现，Circular 圆润几何字体配 Source Code Pro 大写技术标签，色彩走 HSL token 并带透明度通道做层叠。适合后端服务与开发者平台。
开发者工具现代极简
提示词模板
基础模板
Design a Supabase-inspired interface. - Dark-mode-native: near-black backgrounds (#0f0f0f, #171717) — never pure black; - Emerald green brand accent (#3ecf8e, #00c573) used sparingly as identity marker; - Circular font — geometric sans-serif with rounded terminals; - Source Code Pro for uppercase technical labels (1.2px letter-spacing); - HSL-based color token system with alpha channels for translucent layering. Colors: #3ecf8e, #00c573, #0f0f0f, #171717 with #3ecf8e accent. Typography: Circular.
变体提示词
📱 移动端
Design a mobile app with Supabase aesthetics. Use Supabase color identity with #3ecf8e accents. Clean, touch-friendly, native feel.
💻 Web端
Design a web application with Supabase style. Use Supabase color identity with #3ecf8e accents. Professional, responsive layout.
📊 仪表板
Design a dashboard with Supabase design language. Use Supabase color identity with #3ecf8e accents. Data-rich, organized, clear hierarchy.
📄 落地页
Design a landing page with Supabase visual identity. Use Supabase color identity with #3ecf8e accents. Compelling, conversion-focused.
使用示例
Supabase 应用
Web 端Build a web app with Supabase design language and #3ecf8e color system.
Supabase 仪表板
仪表板Create a dashboard using Supabase style with data visualization and Circular typography.
✅ 适合场景
- 后端系统
- 开源后端服务与数据库
- 开发者控制台与文档
❌ 不适合场景
- 奢华零售品牌页
- 明亮卡通的教育产品
DESIGN.md 文件
符合 design.md 开放格式的设计系统描述，可复制或下载后交给 AI 编程工具使用。