精选 · 开放 · 免费
Weaviate
一个集成了向量搜索、RAG和记忆功能的开源平台,用于构建完整的AI体验。
devai
01
设计气质 DNA
向量搜索AI 平台开发者开源RAG
一个为构建下一代AI应用的开发者打造的、外观酷炫的深色主题控制台。
02
色彩
#44e4c5Accent
#ffffffInk
#b9c8deInk soft
#151515BG
#1a1a1aBG soft
#0a0e13BG quiet
rgba(255, 255, 255, 0.1)Line
以深色为基底,搭配鲜明的青绿色点缀,以突显技术的精确性与现代感。
03
字体
transitional-serif · humanist-sans · monospace
正文使用 Plus Jakarta Sans,确保技术内容的清晰易读。 · UI元素和导航使用 Inter。 · 代码片段使用等宽字体,以保持以开发者为中心的风格。 · 避免使用过于装饰性或花哨的字体。
04
间距
4px
8px
16px
24px
32px
48px
64px
96px
遵循统一的4px基础网格,并采用充足的内边距以营造留白和清晰度。
05
表面 (圆角 / 阴影 / 边线)
sm · 4px
md · 8px
lg · 12px
pill · 999px
使用 rgba(255, 255, 255, 0.1) 的1像素细微边框来分隔内容区块。
rgba(0, 0, 0, 0.16) 0px 20px 60px 0px · rgba(0, 0, 0, 0.22) 0px 10px 40px 0px · rgba(255, 255, 255, 0.08) 0px 1px 0px 0px inset
06
布局
1280container
12columns
24pxgutter
768 / 1024breakpoints
标准的网格布局,内容居中,垂直节奏宽松。
07
动效与交互
150msmicro
200mssmall
300msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing
交互元素使用平滑的颜色和背景过渡。 · 内容出现时使用细微的淡入效果。
按钮和链接在hover时呈现细微的颜色和背景变化。 · 提供最小化的视觉反馈,优先保证响应速度。
08
组件
- button 提供双色调的主按钮(纯色青绿色或带青绿色边框的白色)以及幽灵样式的次级按钮。
- card 深色圆角卡片,带有细微边框和内阴影,营造出分层、专业的外观。
- chip 小型的全大写标签,如 'NEW' 和 'TRUSTED BY AI TEAMS',带有细微的背景色。
- input 简洁的深色主题输入框,带有细微边框和圆角。
- hero 全幅深色首屏区域,配有醒目的3D抽象视觉元素和大胆的衬线字体排版。
09
文案语气与禁用清单
- 语气 技术性、权威性,并能赋予开发者力量。
- 标题风格 直接、以行动为导向、大胆有力。
- 按钮文案 使用清晰、可操作的动词,例如“开始构建”和“立即试用”。
- 避免使用浅色或白色背景——截图展示的是深色模式界面。
- 避免使用活泼或圆润的无衬线字体——截图显示标题使用了过渡衬线字体,正文使用了人文主义无衬线字体。
- 避免使用单一的高饱和度强调色——截图以青绿色为主要强调色,但也融入了渐变和3D视觉元素。
- 避免为标题使用纤细或轻薄的字重——截图使用了粗体或中等字重以增强视觉冲击力。
- 避免使用过多边框或粗重的轮廓——截图使用了细微、低透明度的边框。
- 避免使用标准、拥挤的网格——截图展示了宽敞的布局和充足的留白。
- 避免: 避免使用过于随意或俚语过多的语言。
- 避免: 避免使用缺乏技术实质的模糊营销术语。
- 避免: 避免过度使用感叹号。
10
包内真实截图
桌面首屏(hero)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
移动首屏抓自真实页面 · 真 computed styles
11
System Prompt
Weaviate 是一个以开发者为中心的AI平台,专注于向量搜索和RAG。其设计DNA是一个深色模式界面,背景色为 #151515,强调色为 #44e4c5 青绿色,并混合使用了过渡衬线字体和人文主义无衬线字体。布局宽敞,采用12栏网格。关键禁忌包括:避免使用浅色背景,避免为标题使用活泼的无衬线字体,避免用不必要的边框使界面显得杂乱。其语调是技术性、权威性的,聚焦于提升开发者生产力。
en · zh-CN · zh-TW · ja · ko