厳選・オープン・無料

Rekki

卸売業者のために構築されたオフィスロボット

01

デザイン DNA

卸売業者のためのAI搭載オフィスアシスタント

02

カラー

アクション可能な要素に単一の鮮やかなブルーアクセントを使用した、高コントラストなダークモード

03

タイポグラフィ

geometric-sans · sans-serif · monospace

• display56px · 700
• body-lg24px · 400
• body-md18px · 400
• body-sm16px · 400
• label12px · 400

大きな見出しにはタイトなネガティブレタースペーシングを使用 · ナビゲーションリンクと小さなラベルには大文字を使用 · 可読性のために高いコントラスト比（白-on-黒）を維持

04

余白

4pxの倍数。セクション区切りにはより大きな間隔（32, 48）を使用

05

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

1px solid rgba(255, 255, 255, 0.12)

0px 0px 0px 1px rgba(255, 255, 255, 0.12) inset · 0px 0px 1px 0px rgba(255, 255, 255, 0.2)

06

レイアウト

センタリングされたコンテンツを備えたフルワイドダークヒーローに続き、マルチカラムのフィーチャーグリッド

07

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

背景要素の控えめなフェードイン · ボタンホバーステートの滑らかなトランジション

インタラクティブ要素の控えめな明度または不透明度の変化 · ボタン押下時のインスタントなビジュアルフィードバック

08

コンポーネント

• button 大型、ピル型（border-radius: 59px）のソリッドブルー（#0063E1）ボタン。白の太字テキスト
• card ダーク背景（#040910）コンテナ。控えめな1pxインセットボーダーと角丸（16px）
• chip 角丸のダーク、半透明バッジ。AIステータス更新に使用
• input 控えめなボーダーを持つダークテーマの入力フィールド
• hero ダークで控えめに写真的な背景の上に、高コントラストの见出しとサブ见出し

09

文体と禁止事項

• トーン 自信があり、プロフェッショナルで、結果重視
• 見出し 太字で直接的、かつ利益を重視（例：「卸売業者のために構築されたオフィスロボット」）
• CTA アクション重視で高コントラスト（例：「デモを受ける」「デモを予約する」）

• 白い背景を使用しない — スクリーンショットでは深黒（#000000）をプライマリ背景として使用
• プライマリボタンに角長方形を使用しない — スクリーンショットではピル型ボタン（border-radius: 59px）を使用
• 见出しにグレーがかったテキストを使用しない — スクリーンショットではメイン见出しに高コントラストの白（#FFFFFF）を使用
• 装飾的なセリフ体を使用しない — スクリーンショットではクリーンな幾何学的およびサンセリフ体のフォントカテゴリを使用
• 多数のアクセントカラーを使用しない — スクリーンショットでは単一の支配的なブルー（#0063E1）を使用
• 重いドロップシャドウを使用しない — スクリーンショットでは控えめな1pxインセットボーダーとソフトなグローを使用
• 避ける: 遊び心のある業界用語
• 避ける: 受動態
• 避ける: 不必要に複雑な技術用語

10

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

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

11

System Prompt

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