# White Desert｜ブランドのWebデザイン参考

> 「ANTARCTICA」の文字が、霧に溶けて消える。南極旅行のWhite Desertのブランドサイトは、空撮映像の下端に全幅の「ANTARCTICA」を置き、豪華さより“遠さ”そのものを商品として見せている。

- URL: https://white-desert.com/
- 解説ページ: https://katapick.com/sites/white-desert
- カテゴリ: ブランド / 地域: 海外（GB）/ 業種: 南極ラグジュアリー旅行
- テイスト: 写真主体、映像主体、大胆なタイポ、セリフ体、スクロール演出、ミニマル
- 公開・リニューアル: 2026-09 / Katapick掲載: 2026-09-22 / 最終確認: 2026-09-26
- 再現難易度: 4/5（目安 32 時間）

## 編集部のひとこと（Luna）
右寄せのステートメント、最終行だけグレーに落としてる。最後だけ声をひそめて言い終える感じ。……ずるい。こういう小細工、嫌いじゃない。

## デザインの見どころ
- 全幅の「ANTARCTICA」がスクロールでぼけ、霧に消える。見出しがそのまま、白い本文へのつなぎ目になる
- 細い縦のグリッド線を全面に通す。余白の多い画面が、ただの空きではなく測られた空白に変わる
- 旅程は1枚だけ開いたカードと細い短冊のアコーディオン。5つの旅を並べつつ、選ぶのは常に1つ

## 配色
- #ffffff Snow White（背景）
- #090b10 Polar Night（ダーク背景（ヒーロー下地））
- #e9e7e1 Pale Ice（セクション背景）
- #1f2a44 Expedition Navy（見出し・テキスト）
- #535353 Stone Gray（補助テキスト）
- #ff7e15 Signal Orange（アクセント（Enquire・固定タブ））

## フォント
- 見出し・引用（セリフ / イタリック）: Cardinal Classic Long（代替: Cormorant Garamond）
- メインタイトル・ラベル: Oswald（代替: Oswald）
- 本文・ナビゲーション: Inter Tight（代替: Inter Tight）

## よくある質問
### White Desertのサイトで使われているフォントは？
見出しと引用に Cardinal Classic Long、巨大タイトルとラベルに Oswald、本文とナビに Inter Tight が使われています。Cardinal Classic Long の代わりには Google Fonts の Cormorant Garamond が近い雰囲気です。

### White Desertのように文字が霧に溶けるヒーローはどう作る？
全面映像の上に大きな見出しを置き、GSAP ScrollTrigger の scrub で blur と opacity をスクロール量に連動させます。霧は透過PNGや映像のレイヤーを手前に重ねて下から持ち上げると再現しやすいです。

### White Desertのデザインはどんな業種の参考になる？
高価格帯の旅行・ホテル・リゾート、アウトドアブランドなど、写真と余白で体験の特別さを伝えたいサイトの参考になります。

---
セクション別の構成・モーションの実装方法・AI実装プロンプトを含む「再現用Markdown」は https://katapick.com/sites/white-desert からダウンロードできます。
出典: Katapick（https://katapick.com）
