# IRyS 1st concert “HOPE ||: Beyond the Stars”｜イベント / ライブのWebデザイン参考

> チケットより先に、夜空に浮かぶ一文を読ませる。IRySの1stコンサート特設サイト「HOPE ||: Beyond the Stars」は、細いセリフ体の英日の詞を章の合間に挟み、ライブ告知を一篇の詩のように読ませている。

- URL: https://hope-beyond-the-stars.hololivepro.com/
- 解説ページ: https://katapick.com/sites/irys-hope-beyond-the-stars
- カテゴリ: イベント / ライブ / 地域: 海外（US）/ 業種: VTuber・ライブイベント
- テイスト: ダーク、セリフ体、イラスト、固定CTA、ロングページ
- 公開・リニューアル: 2026-07 / Katapick掲載: 2026-09-26 / 最終確認: 2026-09-26
- 再現難易度: 3/5（目安 30 時間）

## 編集部のひとこと（Luna）
Cormorantの細い英字、暗い地だと普通は消える。なのにうっすらホログラムのグラデを差して、夜空から浮かせてる。和訳はぐっと小さく控えめ。主従の付け方、わかってる。……いいね！！

## デザインの見どころ
- 01〜06の章番号を、星のきらめき付きの極細セリフ数字で大きく。目次がそのまま装飾になる
- 章の合間に英文と和訳の一行を挟む。闇から光へ進む詞が、スクロールの順番を物語にしている
- TICKETはチケット券面の形、MENUは丸い印。夜空の中で、押せる場所だけがピンクに光る

## 配色
- #000411 Midnight（背景）
- #0c0e34 Night Navy（雲・夜空のグラデーション）
- #ced2dd Starlight（テキスト）
- #3fb9ef Nebula Blue（アクセント）
- #ff3ac0 Ticket Pink（TICKET / MENU ボタン）
- #fff2ff Holo White（見出しのハイライト）

## フォント
- 英文見出し・数字・本文: Cormorant Infant（代替: Cormorant Infant）
- 和文の約物: YakuHanMP（代替: Shippori Mincho）
- 装飾ラベル: Cinzel（代替: Cinzel）

## よくある質問
### IRyS 1st concertの特設サイトのフォントは？
英文と数字に Cormorant Infant、和文の約物に YakuHanMP、装飾ラベルに Cinzel が使われています。Cormorant と Cinzel は Google Fonts で無料、和文は Shippori Mincho などの明朝体を合わせると近い雰囲気になります。

### IRyS 1st concertの特設サイトはどんな構成？
英日メッセージのオープニング、キービジュアルと開催概要のあと、01 NEWS から 06 PROFILE までの番号付きの章が続き、章の間に英文と和訳の詞が挟まる構成です。

### どんな業種の参考になる？
VTuberやアーティストのコンサート特設サイト、ストーリー性のあるキャンペーンなど、静かで叙情的なトーンで期待を高めたいページの参考になります。

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