厳選・オープン・無料

Drepute

写真のヒーローイメージと明確なCTAを持つ、クリーンで雰囲気のあるローンチ前ページ。

01

デザイン DNA

製品自体が語らせる、高級感のあるローンチ前ウェイティングルーム。

02

カラー

主に写真背景を活用した、ハイコントラストのモノクロームパレット。

03

タイポグラフィ

transitional-serif · humanist-sans

• display62px · 400
• h244px · 400
• body16px · 400

04

余白

8pxベースのグリッド。セクション間にはたっぷりのパディング（垂直方向56px）。

05

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

1px solid #000000

rgba(0, 0, 0, 0.3) 0px 2px 6px 0px · rgba(0, 0, 0, 0.25) 0px 3px 18px 0px

06

レイアウト

フル幅の写真ヒーロー、その後に中央揃えのコンテンツセクションを配置。

07

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

ページ読み込み要素には1秒のease-inトランジション

ボタンの背景トランジション。 · インタラクティブ要素には標準のポインターカーソル。

08

コンポーネント

• button 白の塗りつぶし背景、黒の大文字テキスト、小さなボーダー半径。
• input ダーク背景に細い白いボーダー。
• hero ビューポート全体の高さ、中央揃えのテキスト、大きな背景画像。

09

文体と禁止事項

• トーン ミニマリストで期待感を煽るような口調。
• 見出し ページ中央に配置された、短く大きなセリフ体の単語。
• CTA 直接的で機能的な表現（例：「詳しく見る」「同意する」）。

• 明るいカラーやネオン色のパレットを使用しない — スクリーンショットはダークでムードのある写真テーマを示しています
• 小さく詰まったテキストを使用しない — スクリーンショットはたっぷりの余白と大きな見出しを示しています
• 複雑なグリッドレイアウトを使用しない — スクリーンショットはシンプルな単一カラム中央揃えレイアウトを示しています
• 丸みのある、ふわふわしたボタンを使用しない — スクリーンショットは最小限の半径を持つ角張った長方形ボタンを示しています
• 装飾的またはスクリプトフォントを使用しない — スクリーンショットは明確なセリフ体とサンセリフのペアリングを示しています
• 煩雑なナビゲーションを使用しない — スクリーンショットは単一のボタンのみを含むクリーンなヘッダーを示しています
• 避ける: 冗長な表現
• 避ける: 長い文章
• 避ける: 煩雑なUIパターン

10

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

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

11

System Prompt

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