HP Production Reference
2026
REFERENCE LIBRARY · 2026
TERASU LAB
— 14 SITES
01
Web Layout Patterns
Webレイアウトパターン + Claude指示テンプレート集
34 patterns
プリローダー
構造
FV
ナビ
+11カテゴリ
02
Animation Patterns
アニメーションパターン + Claude指示テンプレート集
32 patterns
出現
注意喚起
連続
文字
+7カテゴリ
03
Web Font Library
HP制作のためのWebフォント図鑑
47 fonts
英字
日本語
組み合わせ
Claudeに指示ボタン
04
Color Library
全色集 + 配色集
335 items
カラースケール51
配色284
HEXコピー
05
Reference Sites
HP制作の参考サイト集（業種別・コメント付き）
49 sites
BtoB・コンサル
建築・不動産
美容・サロン
飲食
宿泊
+5業種
06
Saki's Selection
咲輝の厳選参考サイト集（自分専用セレクション）
厳選
咲輝
参考HP
07
mikke!
一般公開のHP参考サイトギャラリー（mikke.scale-group.co.jp）
外部サイト
参考ギャラリー
一般公開
08
Portfolio
TERASU 制作実績
10 projects
TERASU
SCALE
建築デモ
09
Glossary
HP制作用語集（クライアント説明＋社内ナレッジ用）
138 terms
基本構造
デザインUI
アニメ
SEO解析
+4カテゴリ
10
CTA Patterns
CTAパターン集（ボタン・セクション・文言・エフェクト + 指示プロンプト + お気に入り）
45 patterns
Buttons
Sections
Copy
Effects
11
参考パーツ集
部位別に参考HPを整理（1サイトを複数カテゴリにタグ付け可）
7 categories
レイアウトデザイン
プリローダー
動き
FV
配色
ナビ・フッター
12
セクション
いいと思ったサイトのセクションをスクショで収集（リンク＋メモ付き）
スクショ集
セクション単位
リンク
メモ
13
動き
動きが良いサイトをサムネ付きで丸ごとブックマーク（リンク＋メモ付き）
サムネ集
サイト全体
自動サムネ
リンク
メモ
14
推しページ
「このページが特にいい！」という1ページをサムネ付きでブックマーク（リンク＋メモ付き）
サムネ集
ページ単位
自動サムネ
リンク
メモ