# 株式会社TVer 採用サイト｜採用のWebデザイン参考

> 手書きの「Frame!」が、見出しからはみ出してる。TVerの採用サイトは、紺の太い英字に手書きの「Frame!」を斜めに重ね、キャッチコピーの意味をレイアウトそのもので体現している。

- URL: https://recruit.tver.co.jp/
- 解説ページ: https://katapick.com/sites/tver-recruit
- カテゴリ: 採用 / 地域: 国内（JP）/ 業種: 動画配信サービス
- テイスト: 写真主体、大胆なタイポ、手書き文字、ブルー基調、角丸、カルーセル
- 公開・リニューアル: 2026-09 / Katapick掲載: 2026-09-26 / 最終確認: 2026-09-26
- 再現難易度: 3/5（目安 24 時間）

## 編集部のひとこと（Bruno）
最初は手書きの「Frame!」、最後のエントリーは手書きの「Join!」。同じ手書きで始めて同じ手書きで終わるから、読み終わりに自然と背中を押されるんだよね。この締め方はうまい。

## デザインの見どころ
- 手書きの「Frame!」が見出しの枠を物理的にはみ出す。コピーと造形がぴたりと噛み合う
- 角丸の社員写真を大小ばらばらに散らし、整いすぎない社風をタイルの揺らぎで見せる
- 職種紹介は放射状の図解1枚。組織の全体像を、読ませる前に掴ませる

## 配色
- #f5f8fa Ice White（背景）
- #0c4f86 Deep Navy（見出し・テキスト / フッター背景）
- #02b1ff Sky Blue（ボタン / セクション背景）
- #0b99e5 Ocean Blue（サブアクセント / リンク）
- #02f3f9 Neon Cyan（アクセント（手書き文字））
- #a7eeff Pale Aqua（図解の円・装飾）

## フォント
- 英字見出し・ナビゲーション: Poppins（代替: Poppins）
- 和文見出し・本文: 秀英角ゴシック銀（代替: Zen Kaku Gothic New）
- 補助テキスト: Lato（代替: Lato）

## よくある質問
### TVer採用サイトのフォントは？
英字に Poppins、和文に秀英角ゴシック銀、補助的に Lato が使われています。和文を無料で置き換えるなら Zen Kaku Gothic New や Noto Sans JP が近い印象になります。

### TVer採用サイトは何で作られている？
抽出データからノーコードツールの STUDIO（内部は Nuxt）で制作されていることが確認できます。フォントは Google Fonts と STUDIO のフォント機能を併用していると思われます。

### TVer採用サイトのような採用サイトを作るには？
ブランドカラー2〜3色で配色を絞り、英字の大見出しと手書き文字を重ねたヒーロー、角丸写真のコラージュ、記事カルーセルを組み合わせるのが要点です。STUDIO でもカルーセルと表示アニメーションで再現できます。

### どんな業種の参考になる？
Web サービス、メディア、エンタメ系 IT 企業など、明るく親しみやすい社風と職種の幅広さを同時に伝えたい企業の採用サイトの参考になります。

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