厳選・オープン・無料
Cockroach Labs
クラウド非依存のPostgreSQL互換データベースプラットフォーム。現代のミッションクリティカルアプリケーション向け。
devdb
01
デザイン DNA
データベースクラウドネイティブ分散エンタープライズ信頼性
ビジネス上重要なアプリケーションの基盤となる記録システムとしてデータベースを位置づける現代的なインフラ企業。
02
カラー
#6933FFAccent
#000000Ink
#333333Ink soft
#FFFFFFBG
#FCFCFDBG soft
rgba(234, 236, 240, 1)Line
モノクロームをベースに、プライマリアクションを強調するために鮮やかな紫のアクセントを使用した、高コントラストでクリーンなインターフェース。
03
タイポグラフィ
humanist-sans
- display
56px · 600 - heading
40px · 500 - body
18px · 400
フレンドリーかつプロフェッショナルな技術的な印象を出すため、ヒューマニストサンセリフ（Poppins/Open Sans）を使用します。 · 大きな表示タイプには、 tightな文字间距を維持し、ビジュアルの一体感を生み出します。 · 本文には、技術的な可読性を確保するために、十分な行間（1.5-1.7）を確保します。
04
余白
4px
8px
16px
24px
32px
48px
64px
96px
レイアウトのアライメントに一貫した24pxのガターを持った、標準的な4pxグリッドベースのスペーシング。
05
サーフェス (角丸 / 影 / 罫線)
sm · 4px
md · 8px
lg · 12px
pill · 9999px
1px solid #EAECF0
0px 2px 4px 0px rgba(0, 0, 0, 0.075) · 0px 0px 5px 0px rgb(128, 128, 128)
06
レイアウト
1280container
12columns
24pxgutter
768 / 1024breakpoints
センタリングされたコンテンツコンテナと交互に配置されるフル幅ヒーローセクション。
07
モーションとインタラクション
200msmicro
300mssmall
800msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing
ホバー時の滑らかな色と背景のトランジション（0.2秒）。 · インタラクティブ要素や矢印の右方向への移動。
リンクやボタンの微細な色の変化や背景のフィル。 · 標準カーソルポインタでの即座のレスポンス。
08
コンポーネント
- button プライマリアクション用の高コントラストソリッド紫（#6933FF）、ピル型、白文字。セカンダリボタンは紫のボーダーとダークテキストのアウトライン付き。
- card サブtleなボーダーと少しのシャドウでエレベーションを付けた、クリーンでミニマルなカード。
- input ライトグレーのボーダーと8pxのボーダーラディウスを持つ標準フォーム入力。
- hero 幾何学的で明るい青/シアンのグラデーション背景の上に、左揃えの大きなテキスト。
09
文体と禁止事項
- トーン 信頼性とスケールに焦点を当てた、プロフェッショナルで自信に満ち、権威のあるトーン。
- 見出し 製品を重要なインフラの選択肢として位置づける、大胆で断定的なステートメント。
- CTA 無料のエントリポイントやチーム相談を強調する、行動を促す直接的な表現。
- 広装飾的なセリフフォントを使用しない — スクリーンショットはクリーンでモダンなヒューマニストサンセリフアプローチを示しています。
- 暗く彩度の低いパレットを使用しない — スクリーンショットは鮮やかで高彩度の紫のアクセントを特徴としています。
- 複雑で重いドロップシャドウを使用しない — スクリーンショットは奥行きに対して非常に微細で柔らかいエレベーションを使用しています。
- すべてのヒーローテキストをセンタリングしない — スクリーンショットはメインヘッドラインと補足テキストを左揃えにしています。
- 装飾的またはハンドライティングフォントスタイルを使用しない — スクリーンショットは厳格にプロフェッショナルでクリーンな美学を維持しています。
- プライマリCTAに暗い背景を使用しない — スクリーンショットは 'Start free' ボタンに明るい紫のソリッドフィルを使用しています。
- 避ける: 過度に遊び心のある言葉遣い
- 避ける: 技術的裏付けのない曖昧なマーケティングワード
- 避ける: ヒーローセクションにおける密度の高い、フォーマットされていない技術用語
10
パック内の実スクリーンショット
桌面首屏（hero）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
移动首屏実ページから取得 · 実 computed styles
11
System Prompt
Cockroach Labsは、クラウドネイティブデータベースに特化した開発者向けSaaSプラットフォームです。そのデザインはクリーンで権威があり、ヒューマニストサンセリフタイプシステム（Poppins/Open Sans）とモノクロームパレット（黒/白/グレー）を採用し、鮮やかな紫のアクセント（#6933FF）で点睛を加えています。レイアウトは、大胆なタイポグラフィと十分な余白を中心に構成され、信頼性とスケールを伝えます。重要なデザインルール：装飾的なセリフ、彩度の低いパレット、複雑で重いシャドウを避け、すべてのプライマリユーザーインタラクションに際立った紫のアクセントを維持します。技術的な意思決定者を対象とし、プレミアムで信頼できる印象を提供します。
en · zh-CN · zh-TW · ja · ko