精选 · 开放 · 免费

E2B

面向自动化和智能体的企业级开源 AI 沙箱。

devai

E2B 网站截图

↓ 下载设计系统包 (6 MB)在 OpenDesign 中打开

原站: https://e2b.dev

📦 浏览包内文件 →

01

设计气质 DNA

AISandboxAutomationsAgentsOpen-source

一个简洁的、等宽字体的企业级 AI 基础设施蓝图。

02

色彩

#FF8800Accent

#000000Ink

#333333Ink soft

#FAFAFABG

#EBEBEBBG quiet

#666666Muted

rgba(0,0,0,0.1)Line

一种极简、高对比度的单色调色板，以单一的亮橙色作为强调。

03

字体

geometric-sans · grotesque-sans · monospaced

display64px · 700
body16px · 400
mono14px · 400

导航和标签使用等宽字体，全部大写。 · 标题使用紧凑的字间距和高字重。 · 正文使用标准无衬线字体以获得最佳可读性。

04

间距

4px

8px

16px

24px

32px

48px

64px

96px

基于 4px 的一致节奏，配合 24px 的宽间距。

05

表面 (圆角 / 阴影 / 边线)

sm · 6px

md · 0px

lg · 0px

pill · 999px

纤细的 1px 实线黑色边框，强调线框和图表式的美学。

06

布局

1280container

12columns

24pxgutter

768 / 1024breakpoints

主区域采用居中单栏布局，过渡到多栏功能区块。

07

动效与交互

150msmicro

400mssmall

800msmedium

cubic-bezier(0.25, 0.1, 0.25, 1)easing

交互元素在 hover 时的细微 transform。

细微的背景或透明度变化。 · 即时响应，无繁复动画。

08

组件

button 纯黑色背景配白色等宽文本，或幽灵按钮样式配 1px 黑色边框。
card 极简风格，由 1px 黑色边框和类似终端窗口的等宽标题定义。
chip 小型组件，橙色背景配白色大写等宽文本。
input 极简风格，带等宽标签的 1px 实线边框。
hero 巨大的粗体几何标题，配有等宽字体的标语和 CTA 按钮。

09

文案语气与禁用清单

语气技术导向、自信且以开发者为中心。
标题风格 大写、粗体、简洁。
按钮文案 直接、祈使语气的等宽字体指令（例如：开始免费使用、查看文档）。

不要使用投影效果——截图显示所有元素使用平面的 1px 边框。
不要使用鲜艳的多彩渐变——截图显示严格的单色调色板，仅以橙色为例外。
不要使用装饰性衬线或手写字体——截图显示严格的几何无衬线和等宽字体类别。
不要在主要元素上使用圆角——截图显示尖锐的、0px 圆角的边框。
不要在导航中使用小写——截图显示所有导航项使用严格的大写等宽字体。
不要在正文中使用居中对齐——截图显示仅标题和 CTA 使用严格的左对齐或居中对齐。
避免: 避免过度营销化或浮夸的文案。
避免: 避免复杂的渐变或投影效果。
避免: 避免手写体或过度装饰的字体。
避免: 避免杂乱或多彩的背景。
避免: 避免主区域出现大段多段落的文本。
避免: 避免使用俏皮或卡通风格的图标。

10

包内真实截图

E2B — 桌面首屏（hero） — 桌面首屏（hero）

E2B — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

E2B — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

E2B — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

E2B — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

E2B — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

E2B — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

E2B — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

E2B — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

E2B — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

E2B — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

E2B — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

E2B — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

E2B — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

E2B — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

E2B — 移动首屏 — 移动首屏

抓自真实页面 · 真 computed styles

11

System Prompt

这是一个专注于 AI 沙箱的技术开发者工具网站，定位为“蓝图”或“线框”美学。它使用严格的黑白调色板，辅以单一的高饱和度橙色（#FF8800）作为强调。排版上结合了几何无衬线字体（用于巨大的展示标题）和等宽字体（用于导航、标签和较小的 UI 元素）。布局干净宽敞，通过纤细的 1px 黑色边框界定组件，营造出技术感和终端般的体验。关键约束：绝不使用投影或渐变；始终使用等宽字体作为导航和 CTA；调色板严格保持单色，橙色是唯一例外。

把这份品味接进你的 Agent

把这套设计的机器可读规格——色彩、字体、动效，整套 DNA——直接交给你的 AI Agent。

OpenDesign 技能 ↗ · 本站 Agent 包 ↗

en · zh-CN · zh-TW · ja · ko