# 明日香村観光 あすか時間｜メディアのWebデザイン参考

> 和紙の地に明朝の題字だけで、時間がゆっくりになる。明日香村の観光サイト「あすか時間」は、生成りの紙色と広い余白、有機的に切り抜いた風景写真で、世界遺産の村を急がずに巡らせる。

- URL: https://asukamura.com/
- 解説ページ: https://katapick.com/sites/asuka-jikan
- カテゴリ: メディア / 地域: 国内（JP）/ 業種: 観光（自治体の観光サイト）
- テイスト: セリフ体、余白、写真主体、くすみカラー、スクロール演出、ロングページ
- 公開・リニューアル: 2026-05 / Katapick掲載: 2026-09-26 / 最終確認: 2026-09-26
- 再現難易度: 3/5（目安 36 時間）

## 編集部のひとこと（Iris）
FVの青磁色から、下に行くほど生成りの紙色に落ち着いていくのがすき。朝の空気から、昼下がりの縁側に移っていく感じ。蛍の光の黄緑が、ページ最初の差し色になってるのもいい。

## デザインの見どころ
- FVは淡い青磁色の和紙に「あすか時間」の題字。観光サイト定番の大写真は、あえてその下に譲る
- 写真を丸みのある形に切り抜き、手描きの流線でつなぐ。スクロールがそのまま村の散歩道になる
- 地図帖はエリアの解説と絵地図を左右に並べる。読みながら、行き先の位置関係がつかめる

## 配色
- #ebe3cc Washi Beige（背景）
- #afd5d3 Celadon Mist（FVの和紙背景）
- #fcfaf0 Rice Cream（カード / サーフェス）
- #2c2c24 Sumi（ボタン / 濃色面）
- #161611 Ink Black（テキスト / 円形バッジ）
- #747062 Moss Gray（サブテキスト）

## フォント
- 題字以外の見出し・本文: Shippori Mincho B1（代替: Shippori Mincho B1）
- 約物（括弧・句読点）の字詰め: YakuHanMP（代替: YakuHanMP）

## よくある質問
### あすか時間のサイトで使われているフォントは？
本文・見出しに Shippori Mincho B1、約物の字詰めに YakuHanMP が使われています。どちらも無料で利用できます。題字「あすか時間」はロゴ画像と思われます。

### 観光サイトで写真を有機的な形に切り抜くには？
SVG の clipPath に曲線のパスを定義して画像に当てるか、CSS の mask-image に形のSVGを指定します。形を数種類用意して写真ごとに使い分けると、手作りの印象になります。

### どんなサイトの参考になる？
自治体や観光協会の観光サイト、歴史・文化をテーマにした地域ブランドのサイト、旅館やミュージアムのサイトなど、落ち着いたトーンで土地を案内したいサイトの参考になります。

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