精选 · 开放 · 免费

Qdrant

面向大规模 AI 检索的高性能向量搜索引擎。

devai
Qdrant 网站截图
↓ 下载设计系统包 (32 MB)在 OpenDesign 中打开

原站: https://qdrant.tech

📦 浏览包内文件 →

01

设计气质 DNA

性能规模向量搜索开发者基础设施

一条为 AI 构建的高速数据高速公路,旨在实现最大吞吐量。

02

色彩

#dc244cAccent
#ffffffInk
#8f98b2Ink soft
#090e1aBG
#28324dBG soft
#161e33BG quiet
rgba(40, 50, 77, 1.0)Line

采用高对比度暗色模式,搭配单一、高能量的强调色以驱动行动。

03

字体

humanist-sans · monospace

为展示标题设置紧凑的字间距,营造坚实、建筑感的感觉。 · 为正文文本设置充裕的行高,确保在深色背景上的可读性。 · 为技术标签和代码片段使用等宽字体,以建立开发者语境。

04

间距

4px
8px
16px
24px
32px
48px
64px
96px

垂直间距基于 4px 基础网格驱动,确保模块化组件的一致对齐。

05

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

sm · 4px
md · 8px
lg · 12px
pill · 999px

使用 1px 实线边框,颜色为 #28324d,用于微妙地定义模块和容器。

0px 2px 1px 0px inset 用于按钮发光效果。 · 0px 4px 8px 0px rgba(0, 0, 0, 0.2) 用于浮动元素。

06

布局

1280container
12columns
24pxgutter
768 / 1024breakpoints

全宽英雄区域,包含居中文本和大型背景图像,过渡到用于内容部分的结构化网格。

07

动效与交互

200msmicro
300mssmall
400msmedium
cubic-bezier(0.2, 0, 0, 1)easing

过渡和 hover 状态使用标准 ease-out。 · 模态框和菜单显示使用不透明度和可见性变化。 · 交互按钮状态使用颜色过渡。

背景颜色偏移和细微的不透明度变化。 · 通过 inset 阴影或轻微缩放偏移提供视觉反馈。

08

组件

09

文案语气与禁用清单

10

包内真实截图

抓自真实页面 · 真 computed styles

11

System Prompt

这是一个用于 AI 向量搜索的高性能开发者工具。其设计 DNA 由深色、建筑感的美学定义,采用深海军蓝色背景(#090e1a)和鲜艳的红色强调色(#dc244c)用于关键操作。排版使用简洁的人文无衬线系统字体,展示标题采用紧凑字间距以传达速度和规模。关键禁忌:避免明亮背景、避免过度圆润的边角、避免低对比度文本。界面必须感觉是精心设计的、可靠的、为规模而构建的,具备充裕的留白和清晰的信息层次。

把这份品味接进你的 Agent

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

OpenDesign 技能 ↗ · 本站 Agent 包 ↗

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