# 株式会社ミルーム（MIROOM）｜コーポレートのWebデザイン参考

> 黒い積み木と色の丸で、ロゴができてる。動画講座サービスのミルーム株式会社のコーポレートサイトは、黒い角丸ブロックに原色の丸をはめたロゴと太い英字「Build for the Real.」で、遊び心を幾何学で伝える。

- URL: https://about.miroom.com/
- 解説ページ: https://katapick.com/sites/miroom
- カテゴリ: コーポレート / 地域: 国内（JP）/ 業種: 動画講座サービス運営（オールジャンル動画講座「ミルーム」）
- テイスト: 大胆なタイポ、ビビッド、角丸、マーキー、カルーセル
- 公開・リニューアル: 2026-09 / Katapick掲載: 2026-09-30 / 最終確認: 2026-10-30
- 再現難易度: 2/5

## 編集部のひとこと（Luna）
英字は Poppins の太字、和文は Zen Kaku Gothic New で字間をたっぷり。英字の丸さと和文の開きがそろってて、ロゴの丸とケンカしない。色で騒いで、文字は静か。……悪くない。

## デザインの見どころ
- ロゴは黒い角丸ブロックに6色の丸をはめた組み文字。色の多さが、講座ジャンルの幅をそのまま連想させる
- 白いFVのあとは濃いグレーの章が続き、ニュースで白に戻る。明暗の切り替えだけで章の区切りをつくる
- 「My Time For ( Watercolor )」の括弧の中身が入れ替わる。講座の多さを、一語ずつ手渡してくる

## 配色
- #ffffff White（FV・ニュース・フッター背景）
- #282828 Charcoal（Company・Product などの章の背景 / CTAパネル）
- #000000 Black（ロゴのブロック / テキスト / メニューボタン）
- #e5ff00 Lime（Learn More・Get In Touch のボタン / ロゴの丸）
- #133eff Blue（ロゴの丸）
- #ff85ce Pink（ロゴの丸（ほかに緑 #02c157・赤 #ff3c02・水色 #6dcbfe））

## フォント
- 英字見出し・ナビ・日付: Poppins（代替: Poppins（Google Fonts））
- 和文見出し・本文: Zen Kaku Gothic New（代替: Zen Kaku Gothic New（Google Fonts））

## よくある質問
### ミルームのコーポレートサイトのフォントは？
英字に Poppins、和文に Zen Kaku Gothic New が使われています。どちらも Google Fonts で無料で使えます。

### ミルームのようなブロックと丸のロゴはどう作る？
文字を角丸の長方形の組み合わせで描き、要所に円を重ねて色を分けます。SVG で部品ごとに要素を分けておくと、丸だけを動かすアニメーションにも展開できます。

### ミルームのデザインはどんなサイトの参考になる？
学習サービスやサブスクリプション型のWebサービス、スタートアップなど、遊び心とわかりやすさを両立したいコーポレートサイトの参考になります。

### ミルームのサイトの写真やロゴは使える？
ロゴ、講座の写真、人物写真はミルーム株式会社および各権利者に帰属します。参考にするのは配色や構成の考え方にとどめ、素材は自分で用意してください。

---
セクション別の構成・モーションの実装方法・AI実装プロンプトを含む「デザイン分析MD」は https://katapick.com/sites/miroom からダウンロードできます。
出典: Katapick（https://katapick.com）