厳選・オープン・無料

R/GA

巨大なタイポグラフィと厳格なモノクロームパレットを用いて、クリエイティブな権威と技術的な自信を打ち出す、大胆でハイコントラストのエージェンシーサイトです。

01

デザイン DNA

精密に設計された工業デザイン事務所

02

カラー

絶対的な黒と白の極端なコントラストに、鋭い赤のアクセントを一点だけ加えたものです。

03

タイポグラフィ

grotesque-sans

• display120px · 700
• heading27px · 700
• body16px · 400

ヒーローテキストは、tightな字間と重みのあるウェイトで、すべて大文字で組まれます。 · 本文テキストには、クリーンで読みやすいgrotesque-sansを使用します。 · 大きなディスプレイ用のタイポグラフィにはtightな行間を、本文テキストには快適な行間を使用します。

04

余白

主要なセクション間はたっぷりとした垂直方向のスペーシングを、コンテンツブロック内はtightなグループ化を採用します。

05

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

最小限で、通常は薄いグレー（#E6E6E6）の1pxの線を区切りに使用します。

06

レイアウト

白い背景の上に、フルワイドのヒーローセクションが続き、その後にクリーンで左揃えのコンテンツブロックが配置されます。

07

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

インタラクティブ要素の色と透明度の遷移。

ナビゲーションリンクの色の遷移（0.3s ease-in-out）。 · すべてのインタラクティブ要素で標準のポインターカーソル。

08

コンポーネント

• button クリーンなテキストベースのナビゲーションリンクで、ヘッダー内は大文字です。
• card 確認できず、レイアウトはセクションベースです。
• chip 確認できず。
• input 確認できず。
• hero ビューポート全体を覆う巨大な黒のセクションに、支配的な大文字の白のタイポグラフィが配置されます。

09

文体と禁止事項

• トーン 自信に満ち、権威があり、未来志向。
• 見出し 能力和目的に関する宣言的な、すべて大文字のステートメント。
• CTA 「どのようにお手伝いできるか、ご覧ください」のような、シンプルで直接的な誘い。

• グラデーションは使用しない — デザインはソリッドでフラットな色のブロックを使用します。
• ソフトシャドウは使用しない — 表面はコントラストとクリーンな線で定義されます。
• 主要なコンテナに角丸を使用しない — 美学はシャープで長方形です。
• くすんだ、低コントラストの色は使用しない — パレットは厳密に黒、白、そして赤のアクセント一点のみです。
• メインレイアウトに装飾的なイラストは使用しない — タイポグラフィが主要な視覚要素です。
• 中央揃えのテキストは使用しない — ヘッドラインと本文テキストは左揃えです。
• 避ける: 愛想を振り絞るような、または過度にカジュアルな言葉遣い。
• 避ける: 装飾的、または過度に複雑な視覚要素。
• 避ける: 雑然としたレイアウト、または低コントラストのテキスト。

10

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

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

11

System Prompt

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