厳選・オープン・無料

Algolia

深淵な技術能力と親しみやすく大胆なビジュアルコミュニケーションを-balancedに実現した、プレミアムなAI検索プラットフォーム。

01

デザイン DNA

ダークで技術的なエスネティックと、明るく親しみやすいアクセントを融合させた、洗練された開発者向けの検索インフラ。

02

カラー

高コントラストのダークモード基盤に、鮮やかなプライマリブルーアクセントと、コンテンツセクション用の中立的なライトサーフェスを組み合わせた原則。

03

タイポグラフィ

humanist-sans · geometric-sans · monospace

• display56px · 700
• h240px · 700
• body16px · 400

見出しには、 tighten された字間の幾何学的なサンセリフフォント（bold）を使用。 · 本文テキストは、最大限の可読性を確保するため、クリーンな幾何学的なサンセリフフォントをデフォルトとして使用。 · コードスニペットには、標準的なモノスペースフォントを使用。

04

余白

息継ぎに余裕を持たせるため、4pxのベースグリッドと広めのスペーシングを採用。

05

サーフェス (角丸 / 影 / 罫線)

1px solid rgb(229, 231, 235)

rgba(0, 0, 0, 0.05) 0px 1px 2px 0px · rgba(0, 61, 255, 0.12) 0px 0px 6px 2px

06

レイアウト

24pxのグッターを備えた12カラムグリッドを採用した、max-widthの中央揃えコンテナ。

07

モーションとインタラクション

ボタンやリンクのホバー時における滑らかなカラーと透明度のトランジション。 · インタラクティブ要素への精妙なスケールまたはトランスフォーム効果。

精妙な背景カラーのシフトや透明度の変化。 · 重いアニメーションなしで即座のビジュアルフィードバック。

08

コンポーネント

• button ピルまたは角丸のソリッドブループライマリボタンと、ゴースト/アウトラインのセカンダリボタン。
• card 客戶ロゴのショーケースによく使われる、微妙なシャドウまたはボーダーを備えたクリーンな長方形カード。
• chip スクリーンショットでは目立っては見られません。
• input 微妙なボーダーと虫眼鏡アイコンを備えた検索入力フィールド。
• hero 左側に大胆なテキスト、右側に大きくダークテーマの製品スクリーンショットまたはインタラクティブなビジュアルを配置したスプリットレイアウト。

09

文体と禁止事項

• トーン プロフェッショナルで自信に満ち、技術的に権威のある口調。
• 見出し 短く、的確で、直接的。「Agentic」や「Generative」のような強い形容詞をよく使用。
• CTA 「Explore the platform」や「Get started」のようなアクション指向のフレーズ。

• 純粋なブラックの背景は使用しない — サイトは代わりに深いミッドナイトブルー（#000033）を使用しています。
• プライマリテキストに細く軽いフォントウェイトは使用しない — サイトは-bold（700）またはレギュラー（400）のウェイトを強く好んでいます。
• 到处にシャープで角张ったコーナーは実装しない — デザインは主に8pxまたは12pxの角丸を採用しています。
• 明るくネオンのようなアクセントカラーは使用しない — プライマリアクセントは、確信に満ちたソリッドブルー（#003DFF）です。
• 過度に密集し、窮屈なレイアウトは作成しない — サイトは余裕のあるスペーシング（24pxのグッター、64pxのセクション間隔）を使用しています。
• UIコンポーネントに複雑で重いドロップシャドウは使用しない — シャドウは精妙で、主にソフトなエレベーションやグロー効果に使用されます。
• 避ける: 過度にカジュアルで遊び心のあるスラングは避ける。
• 避ける: 核心メッセージを曖昧にする雑然としたレイアウトは避ける。
• 避ける: 弱い、または非記述的なコール・トゥ・アクションは避ける。

10

パック内の実スクリーンショット

実ページから取得 · 実 computed styles

11

System Prompt

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