# Palazzo Sogni｜ブランドのWebデザイン参考

> 章が進むと、背景がベージュから桃色、水色へ移ろう。フィレンツェ中心部のブティックホテル「Palazzo Sogni」の公式サイトは、フレスコ画と筆記体の見出し、アーチ形の写真で、館内を巡る気分をページの色に託している。

- URL: https://www.palazzosogni.com/
- 解説ページ: https://katapick.com/sites/palazzo-sogni
- カテゴリ: ブランド / 地域: 海外（IT）/ 業種: ホテル・宿泊
- テイスト: セリフ体、写真主体、くすみカラー、余白、固定ナビ
- 公開・リニューアル: 2026-06 / Katapick掲載: 2026-09-26 / 最終確認: 2026-09-26
- 再現難易度: 4/5（目安 36 時間）

## 編集部のひとこと（Iris）
文字色が黒じゃなくて、焦げ茶なのがいい。フレスコ画の顔料みたいな色で、淡い背景の上でもきつくならない感じ。古い壁の手紙を読んでるみたいで、すき。

## デザインの見どころ
- 写真はアーチ形の窓枠で切り抜く。宮殿の窓から覗くような視点が、客室紹介を物語にする
- 筆記体の「Welcome」「Dining」に刷毛の跡を添える。大文字のセリフ体と並べ、格式と手ざわりを同居させる
- BOOK NOW は角を切り欠いた青いボタン。固定ヘッダーに常駐し、どの章からでも予約に戻れる

## 配色
- #f2f1e5 Parchment（背景）
- #eedfd8 Rose Plaster（客室セクションの背景）
- #9eb7c5 Florentine Blue（BOOK NOW ボタン / ダイニング背景）
- #7593a9 Slate Blue（ロゴ / リンク）
- #54452f Umber（テキスト）
- #c5b494 Gilt Sand（刷毛跡 / 装飾）

## フォント
- 見出し・リード・本文: Sogo（代替: Cormorant Garamond）
- ナビ・ボタン・ラベル: Montserrat（代替: Montserrat）

## よくある質問
### Palazzo Sogniのサイトで使われているフォントは？
見出しと本文に Sogo、ナビやボタンに Montserrat が使われています。Sogo の代わりには Cormorant Garamond が無料で近い雰囲気を出せます。筆記体の見出しは画像と思われます。

### Palazzo Sogniのように背景色が章ごとに変わる演出はどう作る？
各セクションに背景色を持たせ、スクロール位置に応じて body の background-color を補間します。GSAP ScrollTrigger や IntersectionObserver で、セクションが画面に入ったときに色を切り替える方法が手軽です。

### Palazzo Sogniのデザインはどんな業種の参考になる？
ブティックホテルや旅館、歴史的建造物を活かした宿泊施設、ウェディング会場など、空間の格式と温かさを両立して伝えたいサイトの参考になります。

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