Blue design systems

Brands and apps whose main color is blue, including Discord, Linear and Stripe. The family comes from each file's primary or accent color; open a file to see its full palette.

497 files, page 9 of 11

Files

MARKAWARE(マーカウェア)

Japan · ABCDiatype

MARKAWARE(https://www.markaware.jp/)のデザイン仕様書。 石川俊介が手がける日本のメンズウェア/エシカルアパレルブランド。オーガニックコットンや環境負荷の低い素材を軸に、仕立ての精度と素材の背景を静かに語る。Shopify / EC-CUBE 系の EC。 最大の特徴は 暖かみのあるオフホワイト(グレージュ)#f7f6f3 の地 と 純黒 #000 の極小テキスト、塗りを持たないアウトライン(枠線)ピ…

Mazda(マツダ)

Japan · MazdaTypeBold

マツダ株式会社 コーポレートサイト(https://www.mazda.com/ja/)のデザイン仕様書。 1920年創業、広島に本社を置く日本の自動車メーカー。「魂動(こどう)デザイン」哲学で知られる。 実サイトの computed style 実測(2026-05-07 取得)に基づく。

Minimal(ミニマル)

Japan · Poppins

Minimal(https://mini-mal.tokyo/)のデザイン仕様書。 2026-05-09 取得の computed style に基づく。

Mitsui Fudosan (三井不動産)

Japan · NewCezanneProN7

三井不動産(https://www.mitsuifudosan.co.jp/)のデザイン仕様書。 日本最大の総合不動産デベロッパー。プレミアム・権威・洗練を体現するコーポレートサイト。 Puppeteer による computed style 実測値(2026-05-23 取得)に基づく。

Mizuno(ミズノ)

Japan · Roboto

Mizuno(https://www.mizuno.jp/)のデザイン仕様書。 ランニング・野球・ゴルフ等のスポーツ用品を扱う EC サイト。 実サイトの computed style 実測(2026-05-09 取得)に基づく。

MOA美術館(MOA MUSEUM OF ART)

Japan · Zen Old Mincho

MOA美術館(MOA MUSEUM OF ART)のデザイン仕様書。

mont-bell(モンベル)

Japan · メイリオ

mont-bell(https://www.montbell.jp/)のデザイン仕様書。 1975年創業、日本最大のアウトドア・登山用品ブランド。"Function is Beauty"(機能美)を哲学に掲げる。 実サイトの computed style 実測(2026-06 取得)に基づく。

MOONSTAR

Japan · Open Sans

MOONSTAR(https://www.moonstar.co.jp/)のデザイン仕様書。 1873年創業、福岡県久留米市の老舗シューズブランド。実サイトの computed style に基づく。

MOTHERHOUSE(マザーハウス)

Japan · Lato

MOTHERHOUSE(https://www.mother-house.jp/)のデザイン仕様書。 2026-05-09 取得の computed style に基づく。

NEIGHBORHOOD(ネイバーフッド)

Japan · HelveticaLTWXX-BoldCond

NEIGHBORHOOD 公式サイト(https://www.neighborhood.jp/)のデザイン仕様書。 滝沢伸介が 1994 年に原宿で設立した日本のストリートウェアブランド。 モーターサイクルカルチャー、ミリタリー、アウトドアの影響を受け、緻密なクラフツマンシップで知られる。 実サイトの computed style 実測(2026-05-09 取得)に基づく。

nendo(ネンド)

Japan · Helvetica Neue

nendo(https://www.nendo.jp/jp/)コーポレートサイトのデザイン仕様書。 佐藤オオキ率いるデザインオフィス。プロダクト・建築・インテリア・グラフィック・パッケージなど領域横断のデザインプラクティス。 実サイトの computed style 実測(2026-05-06 取得)に基づく。

Nikkei (nikkei.com)

Japan · Segoe UI

Nikkei (nikkei.com)のデザイン仕様書。

NOT A HOTEL

Japan · YakuHanJP

NOT A HOTEL 公式サイト(https://notahotel.com/)のデザイン仕様書。 "世界中に自分の家を持つ" をコンセプトにした建築×テクノロジーの不動産ブランド。建築家がデザインした別荘を購入し、使わない日はホテルとして運用できるサービス。 実サイトの computed style に基づいて記述(2026-05-09 取得)。

Notion Dev(Notion Developer Platform)日本語版

Japan · iA Writer Mono

Notion Dev(Notion Developer Platform)日本語版のデザイン仕様書。

Nstock(株式報酬)

Japan · Manrope

Nstock(株式報酬)のデザイン仕様書。

NTT Group (NTTグループ)

Japan · Noto Sans JP

NTT Group (NTTグループ)のデザイン仕様書。

OMRON (オムロン)

Japan · Roboto + Noto Sans JP

OMRON (https://www.omron.com/jp/ja/) のデザイン仕様書。 日本発のグローバル電子部品・ヘルスケアメーカー。FA(工場自動化)・制御機器・ヘルスケア(血圧計等)・社会システム事業を展開。 実サイトの computed style 実測 (2026-06-04 取得) に基づく。

PILOT(パイロット)

Japan · Noto Sans JP

PILOT(https://www.pilot.co.jp/)のデザイン仕様書。 万年筆・ボールペン・文房具を中心とする老舗筆記具ブランドのコーポレート&製品サイト。 実サイトの computed style 実測(2026-05-09 取得)に基づく。

PLST (plst.com/jp)

Japan · 本文と同じスタック

PLST (plst.com/jp)のデザイン仕様書。

Pocari Sweat (pocarisweat.jp)

Japan · Helvetica

大塚製薬 ポカリスエット(https://pocarisweat.jp/)のデザイン仕様書。 実サイトの computed style に基づく。CSS Custom Properties は使用されていない(クラシックな CSS 構成)。

POLA

Japan · 游ゴシック体

POLA 公式サイト(https://www.pola.co.jp/)のデザイン仕様書。 1929 年創業の日本を代表する高級化粧品ブランド。「Science. Art. Love.」を掲げ、研究・芸術・愛をブランドの3軸とする。 実サイトの computed style に基づいて記述。

POPEYE Web

Japan · DM Sans

POPEYE Web(https://popeyemagazine.jp/)のデザイン仕様書。 2026-05-08 取得の computed style と CSS Custom Properties に基づく。

Preferred Networks(PFN)

Japan · Noto Sans JP

株式会社 Preferred Networks(https://www.preferred.jp/ja/)のデザイン仕様書。 2014 年創業。深層学習の研究開発から自社設計の AI プロセッサ(MN-Core)まで、AI 技術のバリューチェーンを垂直統合する日本の AI 企業。 最大の特徴は letter-spacing と line-height が「36px を境に切り替わる」1 本の規則で全ページを通していること。36px 以…

RAKSUL(ラクスル)

Japan · Roboto + Hiragino

RAKSUL(https://raksul.com/)のデザイン仕様書。 クラウド型の印刷・物流プラットフォーム。名刺・チラシ・ポスター等の印刷をネットで発注できる EC マーケットプレイス。 実サイトの computed style 実測(2026-06-09 取得)に基づく。

ROYCE'(ロイズ)

Japan · Noto Sans Japanese

ROYCE'(ロイズ)のデザイン仕様書。

SAKE HUNDRED

Japan · 游明朝

SAKE HUNDRED(https://sake100.com/)のデザイン仕様書。 実サイトの CSS computed style に基づく。ラグジュアリー日本酒ブランドの EC サイト。

SEGA

Japan · Noto Sans JP

SEGA Corporation(https://www.sega.co.jp/)のデザイン仕様書。 実サイトの CSS computed style に基づく。ニュース・コーポレート情報を中心とした企業サイト。

Seiko

Japan · Noto Sans JP

Seiko(https://www.seikowatches.com/)のデザイン仕様書。 実サイトの computed style に基づく。Bootstrap ベースのCSS構成。意味的な CSS Custom Properties はなく、Bootstrap デフォルト(--bs-white, --bs-body-bg 等)のみ使用。

Shimano (シマノ)

Japan · メイリオ

Shimano(https://www.shimano.com/jp)のデザイン仕様書。 実サイトの CSS computed style に基づく。 メイリオ優先のシステムフォントスタック+英文アクセントに PT Sans を採用し、複数のシマノブルーと控えめな角丸(4px)で「精密工学メーカーのコーポレートサイト」としての堅実さを表現している。

SHIPS

Japan · Roboto

SHIPS(シップス)公式サイト(https://www.shipsltd.co.jp/)のデザイン仕様書。 実サイトの computed style に基づいて記述。取得日: 2026-05-22

SIRI SIRI(シリシリ)

Japan · ABC Diatype

SIRI SIRI(https://sirisiri.jp/)のデザイン仕様書。 建築を学んだデザイナー岡本菜穂が主宰する、日本のクラフトマンシップを軸にした現代ジュエリーブランド。江戸切子ガラス(KIRIKO)や籐編み、漆といった伝統素材を、建築的でミニマルな造形へ翻訳したコレクションで国内外のデザイン賞を受けている。 最大の特徴は 欧文グロテスク ABC Diatype(Dinamo)+ 和文ヒラギノ角ゴ/游ゴシックを、ウェイト3…

SORANO HOTEL(ソラノホテル)

Japan · Inter

SORANO HOTEL(ソラノホテル)のデザイン仕様書。

Studio Ghibli

Japan · メイリオ

スタジオジブリ(https://www.ghibli.jp/)のデザイン仕様書。 Bootstrap ベースのクラシカルな構成。CSS Custom Properties は使用せず、Bootstrap ユーティリティとインラインスタイルで構築。 実サイトの computed style に基づく。

SUBARU(スバル)

Japan · ヒラギノ角ゴ Pro

SUBARU(https://www.subaru.jp/)のデザイン仕様書。 自動車メーカー(SUV・セダン・スポーツカー)のオフィシャルサイト。 実サイトの computed style 実測(2026-05-09 取得)に基づく。

Suntory(サントリー)

Japan · ヒラギノ角ゴ W3

サントリーホールディングス公式コーポレートサイト(https://www.suntory.co.jp/)のデザイン仕様書。 「水と生きる」をコーポレートメッセージに掲げる総合飲料・食品・健康・サービス企業。 実サイトの computed style に基づいて記述。

SUZUKI (スズキ)

Japan · Noto Sans JP

SUZUKI (スズキ)のデザイン仕様書。

SUZURI(スズリ)

Japan · Open Sans

SUZURI(https://suzuri.jp/)のデザイン仕様書。 GMO ペパボが運営する、画像 1 枚からオリジナルグッズを作って売れるマーケットプレイス。933 万点超のアイテムが並ぶ。 ペパボ共通のデザインシステム「Nachiguro(なちぐろ)」の上に構築されている。クラスは ncgr- 接頭辞、アイコンは "Nachiguro Icons" という専用フォント、CSS は packs/nachiguro..css(1.…

TABIO(タビオ / 靴下屋)

Japan · 游ゴシック

TABIO(https://tabio.com/jp/)のデザイン仕様書。 「Made in Japan」にこだわるプレミアム靴下ブランド。靴下屋の上位ブランドとして、素材・編み・仕上げの技術を追求する。 実サイトの computed style 実測(2026-05-22 取得)に基づく。

TANITA (tanita.co.jp)

Japan · Noto Sans JP

TANITA (tanita.co.jp)のデザイン仕様書。

TENTIAL

Japan · din-2014

TENTIAL(https://tential.jp/)のデザイン仕様書。 2026-05-09 取得の computed style に基づく。

TIGER Corporation(タイガー魔法瓶)

Japan · Hiragino Kaku Gothic ProN

TIGER Corporation(https://www.tiger-corporation.com/)のデザイン仕様書。 1923年創業の魔法瓶メーカー。炊飯器、電気ケトル、ステンレスボトル等の家庭用調理・保温製品を展開。 実サイトの computed style 実測(2026-05-09 取得)に基づく。

Tokyo Metro

Japan · メイリオ

東京メトロ(https://www.tokyometro.jp/)のデザイン仕様書。 実サイトの CSS および computed style(2026-06-19 取得)に基づく。CSS Custom Properties は未使用。

tokyobike

Japan · ヒラギノ角ゴ Pro W3

tokyobike(https://tokyobike.com/)のデザイン仕様書。 WordPress ベースのサイト。システムフォント(ヒラギノ角ゴ Pro W3)とミュートなグレー系配色による、温かみのあるライフスタイルブランドのデザイン。 実サイトの computed style に基づく(2026-05 取得)。

TOMORROWLAND(トゥモローランド)

Japan · Noto Sans JP

TOMORROWLAND 公式サイト(https://www.tomorrowland.co.jp/)のデザイン仕様書。 1978年創業のセレクトショップ / オリジナルブランド。GALERIE VIE、MACPHEE、DES PRES 等を擁するファッション企業。 "Tomorrow is Beautiful." をブランドメッセージに掲げ、上質なライフスタイルを提案する。 実サイトの computed style に基づいて記述。

Topmuseum

Japan · Univers Next W04 Regular

東京都写真美術館(https://topmuseum.jp/)のデザイン仕様書。 1995 年開館、東京・恵比寿ガーデンプレイス。写真と映像を専門とする日本初の公立美術館で、通称「TOP MUSEUM」。 最大の特徴は、UI から色をほぼ完全に抜くこと。白地・黒文字・グレー 6 段だけで組み、写真作品と展覧会ポスターだけが色を持つ。写真美術館としての「地は白、額は黒 1px」という原則を CSS レベルで徹底している。 和文は 游ゴシ…

TOPPAN(TOPPANホールディングス)

Japan · 凸版文久ゴシック Pr6N

TOPPAN(https://www.holdings.toppan.com/ja/)のデザイン仕様書。 1900年創業の総合印刷会社。印刷テクノロジーを核に、情報コミュニケーション・生活産業・エレクトロニクス事業を展開。 実サイトの computed style 実測(2026-05-25 取得)に基づく。

Toraya(とらや・株式会社虎屋)

Japan · 游ゴシック体

株式会社 虎屋 公式サイト(https://www.toraya-group.co.jp/)のデザイン仕様書。 室町時代後期から続く老舗和菓子店。羊羹で知られ、皇室御用達の格式と現代的な和の美意識を併せ持つ。 実サイトの computed style 実測(2026-05-07 取得)に基づく。

Toshiba

Japan · Arial

東芝グローバルサイト(https://www.global.toshiba/jp.html)のデザイン仕様書。 実サイトの computed style に基づく。CSS Custom Properties は未使用。 AEM(Adobe Experience Manager)ベースの静的コーポレートサイト。

Other colors