型を、組み合わせる。

01 · 配色

どのサイトの色を借りる？

02 · 文字

どのサイトの書体と文字組みにする？

03 · セクション

セクションを上から並べる

• ＋ローディング『18TRIP（エイトリ）』2周年特設サイト白地に盾型のエンブレムと横長の読み込みバーを表示する。キャプチャでは画面上部に白い弧が残っており、白い幕が抜けてトップに切り替わる。
• ＋ファーストビュー207株式会社（ニーマルナナ）「行動の自由を加速させる」を2行の太い和文で左上に置き、英訳を小さく添える。物流・ロボット・ドローンなどを描いたアイソメトリックの街のイラストが画面の右半分から下を占め、下部に「Missionについて」ボタン。
• ＋ヒーロー2xA Studio黒地のキャンバスに、キリル文字を詰めたNの字形、ASCII文字のグラデーション、座標のような数字など、ジェネラティブな作品が切り替わりながら表示される。
• ＋ヒーロー360 Lexington Ave内装の写真を全面に敷き、「Built For Difference Makers」と、グランド・セントラル駅から徒歩2分という立地の一文。右下に写真付きの「Explore Offices」カード。
• ＋ヒーローAardvark Book Club黄色の地にうねる淡黄とオレンジの色面を重ね、極太3行の「Unbox stories worth talking about」、ピンクのCTA、宙に浮かぶハードカバー、手書きの配送エリア表記を置く。
• ＋ヒーロー株式会社ADDICTモノクロのダッシュボード画面や赤い床のオフィス通路の画像に、「CREATE OBSESSION」「執着を創れ。」と巨大な「執着」の文字を重ねる。左下に最新ニュースの帯、右下にSCROLL DOWNと赤い菱形。
• ＋ヒーローAFURI BREWING / 阿夫利ブルーイング山並みと青空の写真の上に、青い背景で撮った缶とグラスの写真を重ねる。左に「AFURIらしいやり方で、ビールをつくってみたいと思った。」、左下に大きな「AFURI BREWING」と「阿夫利ブルーイング」、右下に SCROLL DOWN。
• ＋ヒーローAI in Design Report 2026上半分は抽象画像の矩形を重ねたコラージュに職種ラベルを添え、下半分は左に小さなリード文、右に2行の巨大な「AI in Design Report 2026」。最下部に等幅のクレジットと「Scroll to read ↓」。
• ＋イントロダクションAI in Design Report 2026「AN INFLECTION POINT」のラベルと大きな一文のステートメント。人物写真の上に「318+」「8+」の数値パネルを重ね、右寄せの本文で調査概要を説明する。
• ＋ヒーローAlethia深緑の背景に3行の大きなサンセリフ見出しを左上、中央に苔むした岩、周囲に小さな岩を配置。岩の上に白い四角枠と等幅の計測値ラベルを重ね、左下にリード文、右下に「Scroll to discover」。
• ＋ヒーローANA大阪空港株式会社青みをかけた空港の現場写真のスライドに「私たちの想いが、世界を動かす」と英文、番号と一時停止ボタン。左下にお知らせの帯、右下に搭乗券型の「ITM・UKB ✈ WORLD 採用情報はこちら」カード。
• ＋ヒーロー映画『ホウセンカ』黒枠で囲んだKVのスライダーを中央に、左に丸いバッジ（Blu-ray & DVD / Netflix）とキャスト・スタッフのクレジット、上に映画祭のロゴ、右端にピンクの縦書きセリフの帯とサムネイル3枚、右下に白地のキャッチコピー。
• ＋イントロダクション・ストーリー映画『ホウセンカ』小さなアイコンで挟んだ見出しの下に、白い明朝の中央揃えで作品紹介とあらすじ。人名や作品名は水色で強調する。
• ＋ヒーローあおぎり高校 入学祭2026！ ～『好き』なことしかしたくない！～校舎・桜・入学式の看板を背景に、制服姿のメンバーの集合イラストを全面に配置。中央下にイベントロゴとサブタイトル、英字表記を重ねる。
• ＋ヒーローApocalypse Coffee Roasters「CERTIFIED ORGANIC」などのバッジ2つ、「IT'S THE END… OF BAD COFFEE.」の2段見出し、等幅の本文、SHOP COFFEE / VISIT OUR CAFES の導線。右に3袋のパッケージと「BUY BUNDLE」のラベル、周囲に色付きの影を持つコーヒー豆を散らす。下端は破れた
• ＋ヒーローAsobica画面を写真と、ロゴタイプを切り抜いた黒い曲面で2分割し、曲面の上に「遊びのような熱狂で、世界を彩る」。キャプチャごとに写真と図形の左右が入れ替わっている。
• ＋ヒーローAspen Search画面を田の字に区切り、左上に巨大な「Aspen」、右上と左下に網点のグラフィック、右下に黒パネルの紹介文とミントのパネル（採用実績企業のロゴ列）を置く。スクロールで「Search」「PLACING WINNERS.」の大見出しが続く。
• ＋FV明日香村観光 あすか時間青磁色の和紙に「明日香村観光サイト あすか時間 VISIT ASUKA」の題字と円形の世界遺産登録バッジ。下半分に蛍の舞う渓流の写真、お知らせカード、UN Tourism のロゴ。
• ＋ヒーローbleibtgleich'26左上に黒い顔型のロゴマーク、縦罫の右に「Based in Kyiv / Working w/ TFTL」。罫の下端に巨大な名前「Maksym Bleibtgleich」を置き、右上に角丸の「Menu」ボタン。
• ＋ファーストビュー『ちいかわぽけっと』1st Anniversary 特設サイトPCでは画面の左側に白雪姫テーマのキービジュアルを固定し、右の細いカラムにロゴ「ちいぽけ 1st ANNIVERSARY」と新イベントの告知バナーを置く。右上に金縁の紫の円形メニュー。SPではキービジュアルの上にロゴを重ねる。
• ＋ヒーロー（フレーバー選択）Ciao Energy黒からグレーのグラデーション空間に3Dの缶を横に並べ、中央の1本を台座の上に浮かべる。下部に斜体の味名、虹色のグラデーションのスライダー、「スクロールで発見」の案内。ヘッダーは左にサウンドのON表示、中央ロゴ、右にMENUと白いCONTACTボタン。
• ＋ヒーローClico AI Studio中央揃えのセリフ体見出し「AI Studio for Deep Research, Images & Video」とリード文。生成物や操作画面の角丸タイルを周辺をぼかして敷き、手前にプロンプト入力欄・モデル選択・Startボタン、下に機能アイコンを並べる。
• ＋ヒーロー映像Decathlon Yestalgia明るいグレーの背景中央に縦長の映像フレームを置き、周囲に稲妻・円弧・円のモチーフを散らす。スクロールでフレームが横幅いっぱいに広がる。
• ＋ヒーローDENSETSU.EXE星と稲妻、音符が飛ぶ中で3人が跳ねるキービジュアル。左上にパステルの「DENSETSU .EXE」ロゴが枠をはみ出して乗る。
• ＋ヒーローデジタルグリッド株式会社淡い水色の角丸フレームを全幅に置き、左上と左下をロゴ・見出しの形に切り欠く。フレーム内で色帯と都市のイラストが動き、左下に英字の小見出しと大きな和文見出し、右下に閉じられるお知らせカード。
• ＋ヒーロー（No Bad Outputs）.txt (dottxt)「01 BY THE TEAM BEHIND OUTLINES (65M+ DOWNLOADS)」のラベルとピクセル文字の「NO BAD OUTPUTS」。左下にコマンド例と Try the API / Book a Demo を収めたレトロなウィンドウ、右上にディザ処理のピクセル画像と閉じられる小窓、右下にピクセルア
• ＋ヒーローDriveBerry車に荷物を積む家族の映像に、大きな「DriveBerry」と一文のコピー、「Faites défiler」のスクロール誘導を重ねる。
• ＋ヒーロー越前信用金庫 採用サイトコーラルレッドの地に、白フチで切り抜いた職員、恐竜の模型、そば、城、看板を散らし、「あつまれ 地域の笑顔」のコピーと流れる「RECRUIT」の大文字を重ねる。
• ＋ヒーローElva黒地にぼかした巨大な英文コピーを敷き、中央にスマホのモックアップ。画面の中に人物の映像と「Meet Elva. A filmmaking crew in your phone.」を映す。
• ＋オープニングERA Residence赤紫の地に花の紋章、中央に「ERA RESIDENCE」のロゴと筆記体の「Estepona」。左右に字間を大きく開けた「COSTA」「DEL SOL」を置き、背景に大きな筆記体を透かしで敷く。

04 · あなたの案件