厳選・オープン・無料

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。 · モーダルやメニューの表示のための不透明度と可視性の変化。 · インタラクティブなボタン状態のためのカラートランジション。

背景色のシフトと微細な不透明度の変化。 · インセットシャドウや微細なスケールシフトによる視覚的フィードバック。

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システムを使用し、ディスプレイ見出しにはタイトな文字間隔を使用して、スピードとスケールを伝達します。重要な禁止事項：軽い背景、過度に丸みのある角、低コントラストのテキストは避けてください。インターフェースは、エンジニアリングされ、信頼性があり、スケールのために構築された感覚を持ち、十分な余白と明確な情報階層を備えている必要があります。

このセンスを AI エージェントへ

この設計の機械可読な仕様——カラー・タイポ・モーションまで——をそのまま AI エージェントに渡せます。

OpenDesign スキル ↗ · このパック（エージェント用） ↗

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