# 無原唱レコードフェス2026「RE;GAIN」｜イベント / ライブのWebデザイン参考

> 集合絵に、筆で殴り書いたロゴをドンと重ねてる。無原唱レコードフェス2026「RE;GAIN」の特設サイトは、黄色地のキービジュアルに太字と筆致の混ざったロゴを置き、横スクロールで公演情報まで一気に運ぶ。

- URL: https://riot-music.com/mugensho-record/mgsfes2026-regain/
- 解説ページ: https://katapick.com/sites/mugensho-fes-2026-regain
- カテゴリ: イベント / ライブ / 地域: 国内（JP）/ 業種: 音楽レーベル・ライブイベント
- テイスト: 横スクロール、ビビッド、イラスト、大胆なタイポ、カルーセル、周年
- 公開・リニューアル: 2026-05 / Katapick掲載: 2026-09-26 / 最終確認: 2026-09-26
- 再現難易度: 4/5（目安 28 時間）

## 編集部のひとこと（Pip）
え、待って、FVの次がいきなり「Official Report」なの神すぎる！！行けなかった勢も写真スライダーで当日の空気を浴びられるし、終演後も特設サイトがちゃんと生きてるのうれしい！

## デザインの見どころ
- ロゴは「RE」が太いゴシック、「GAIN」がかすれた筆致。整いと崩しの対比がフェスの熱を立ち上げる
- PCは横スクロールの一本道。レポート→公演情報→出演者→チケットと、迷わせずに購入まで運ぶ
- 見出しは「ABOUT; 公演情報」とセミコロン区切り。タイトルの「;」が、ページ全体の書式になっている

## 配色
- #fefa10 Acid Yellow（キービジュアル背景 / アクセント）
- #0021ff Electric Blue（差し色（しぶき・リンク））
- #000000 Ink Black（ロゴ / メニューボタン / テキスト）
- #ffffff Paper White（背景）
- #171718 Stage Black（レポートセクション背景）
- #efefef Light Gray（サーフェス）

## フォント
- 英字見出し・本文・ナビ: Satoshi Variable（代替: Manrope）
- 補助ラベル: IBM Plex Mono（代替: IBM Plex Mono）

## よくある質問
### 無原唱レコードフェス2026「RE;GAIN」のサイトのフォントは？
英字の見出し・本文に Satoshi（Variable）、補助ラベルに IBM Plex Mono が使われています。Satoshi の代わりに Google Fonts で揃えるなら Manrope が近い印象です。

### このサイトのような横スクロールのページはどう作る？
セクションを横一列に並べたラッパーを画面に固定し、縦スクロール量に応じて translateX で横へ動かすのが一般的です。GSAP ScrollTrigger の pin と Lenis の慣性スクロールを組み合わせると滑らかになります。

### どんなサイトの参考になる？
VTuber・VSinger のライブやフェスの特設サイト、音楽レーベルのイベントLPなど、キービジュアルを主役にしつつチケット・グッズまで一本道で案内したいサイトの参考になります。

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