精選 · 開放 · 免費

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

使用 #28324d 的實心 1px 邊框，以微妙定義模組和容器。

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

標準 ease-out 用於過渡和 hover 狀態。 · 不透明度和可見性變化用於彈出視窗和選單顯示。 · 顏色過渡用於互動按鈕狀態。

背景顏色變化和細微的不透明度改變。 · 透過 inset 陰影或輕微縮放變化提供視覺回饋。

08

組件

09

文案語氣與禁用清單

10

包內真實截圖

Qdrant — 桌面首屏（hero）
桌面首屏（hero）
Qdrant — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Qdrant — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Qdrant — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Qdrant — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Qdrant — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Qdrant — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Qdrant — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Qdrant — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Qdrant — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Qdrant — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Qdrant — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Qdrant — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Qdrant — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Qdrant — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Qdrant — 移动首屏
移动首屏

擷取自真實頁面 · 真 computed styles

11

System Prompt

這是一個為 AI 向量搜尋設計的高效能開發者工具。設計 DNA 由深色、建築般的美學定義，使用深邃的藍色背景（#090e1a）和鮮明的紅色強調（#dc244c）用於關鍵操作。排版使用簡潔的 humanist-sans 系統，顯示標題採用緊湊的字間距以傳達速度與規模。關鍵禁忌：避免淺色背景、避免過度圓潤的邊角、避免低對比度文字。介面必須感覺是工程化、可靠且為規模而建，具有寬裕的留白和清晰的資訊層次。

把這份品味接進你的 Agent

把這套設計的機器可讀規格——色彩、字體、動效，整套 DNA——直接交給你的 AI Agent。

OpenDesign 技能 ↗ · 本站 Agent 包 ↗

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