Design System Preview
株式会社MIXI — 日本語版

DESIGN.md から抽出したデザイントークンのカタログ。MIXI Red #e5004d をアクセントに据えた、白基調のクリーンなコーポレートデザイン。computed style 実測値に基づく。

詳しく見る 採用情報

01 / Colors

カラーパレット

Brand
MIXI Red
#e5004d
バナー・アクセント
Gray Badge
#7b7b7b
PDF バッジ
Text
Text Primary
#000
見出しテキスト
Text Content
#333
本文テキスト
Text Light
#666
補助テキスト
Text Lighter
#888
日付・メタ情報
Text Lightest
#919191
プレースホルダー
Surface & Background
Background
#ffffff
ページ背景
Surface Gray
#f7f7f7
セクション背景
Footer
#000000
フッター背景
Border
#ccc
フォームボーダー
Border Light
#eee
区切り線・カード枠

02 / Typography — 実測値

タイポグラフィ階層

「熱い」仲間との体験が、君の「成長」を後押しする
Noto Sans JP / 35px / 600 / line-height: 1.57 / letter-spacing: 0.02emヒーローステートメント
MIXIは「豊かなコミュニケーションを広げ、世界を幸せな驚きで包む」というミッションのもと、コミュニケーションサービスやスポーツ、ライフスタイル領域で多彩な事業を展開しています。
Noto Sans JP / 15px / 400 / line-height: 1.86 / letter-spacing: 0.02em本文ラージ
2024.12.25 — 年末年始の営業についてのお知らせ
Noto Sans JP / 13px / 400 / line-height: 1.7 / letter-spacing: 0.02emニュース本文
企業情報  事業紹介  採用情報  IR
Noto Sans JP / 13px / 600 / line-height: 1.15ナビゲーション
プライバシーポリシー  利用規約  お問い合わせ
Noto Sans JP / 12px / 400 / line-height: 1.15 / letter-spacing: 0.05emフッター

サービスページの組版サンプル

MIXIの事業領域

MIXIは「モンスターストライク」をはじめとするデジタルエンターテインメント事業を中心に、スポーツやライフスタイル領域でも多彩なサービスを展開しています。コミュニケーションを軸に、人と人をつなぐ体験を提供し続けています。

スポーツ事業

プロスポーツチームの運営やベッティングサービスを通じて、スポーツの新しい楽しみ方を提案しています。FC東京やチャリ・ロトなど、リアルとデジタルを融合した体験づくりに取り組んでいます。


04 / Buttons

ボタンバリエーション

詳しく見る
Primary (Black)
採用情報
Accent (MIXI Red)
JP EN
Language Switcher
Disabled

カードコンポーネント

デジタルエンターテインメント

モンスターストライクをはじめ、世界中で楽しまれるゲームコンテンツを開発・運営しています。

詳しく見る →

スポーツ

FC東京の運営やTIPSTARなど、スポーツ×テクノロジーで新しい観戦体験を創出しています。

詳しく見る →

ライフスタイル

家族向けコミュニケーションアプリ「みてね」など、日常を豊かにするサービスを提供しています。

詳しく見る →

06 / Forms

フォーム要素

デフォルト — border: #ccc, radius: 3px
フォーカス — border: #85b7d9 (Blue Glow)
エラー — border: #cc0000

07 / Elevation

Depth & Elevation

Level 0: Flat
影なし・ボーダーのみ(カード・コンテンツ)
Level 1: Header
0 1px 4px rgba(0,0,0,0.08)
Surface Gray
#f7f7f7 + border #ccc

08 / Layout

コンテンツ幅

Main Content 960px
Article 620px