UI Skillbook
2

Design systems set in Roboto

Brands and apps whose DESIGN.md names Roboto as a typeface, including Aljazeera, AmazingTalker and Avanza. Each file also lists the sizes, weights and colors that go with it, so your coding agent can match the whole style.

60 files, page 1 of 2

Files

Aljazeera

Brands · Roboto

An analysis of Al Jazeera's design language — a hard-news editorial system built on flat white paper and dense Roboto headline stacks, signed by one saturated orange used as logo block and section-eyebrow bar,…

AmazingTalker

Brands · Roboto

AmazingTalker is a Taiwanese language-learning marketplace, and its design speaks the language of friendly, approachable confidence rather than institutional gravity. The page opens on a clean white canvas (#ffffff)…

Avanza

Brands · Avanza

"Avanza startades med en enkel idé" — Avanza started with a simple idea: to build a company its founders would want to be customers of, charging as little as possible and offering "cheaper, better and simpler…

Cybozu

Brands · Hiragino Kaku Gothic Pro

Cybozu (サイボウズ) is Japan's leading teamwork-software maker — the company behind kintone, Garoon, and Cybozu Office — and its design language splits cleanly into two brand-owned worlds that share one philosophy:…

Dcard

Brands · Roboto

Dcard is Taiwan's largest anonymous social platform — and its design system is an exemplar of Material Design adapted for East-Asian forum culture. The page chrome is wrapped in a deep teal-navy (#00324e) header bar…

Dell

Brands · Roboto

Dell is one of the world's largest hardware makers, and its digital surfaces carry the weight of that scale: a global commerce engine selling laptops, monitors, servers, and workstations to consumers, gamers, small…

Doctolib

Brands · Montserrat

Doctolib is the French healthcare platform patients use to book medical appointments and practitioners use to run their practices. "Since 2013," in its own words, it "has been committed to one objective: Building the…

FlixBus

Brands · Roboto

FlixBus is the long-distance bus network of Flix SE, a Munich travel-tech company. In its own words, Flix was "launched in 2013 in Munich" and has since carried more than 500 million travellers across more than 40…

FOLIO (フォリオ)

Brands · Aoto Gothic

FOLIO is a Japanese online securities company. It started with a mission stated as 「資産運用をバリアフリーに。」 — asset management without barriers. Today its public face also carries ROBOPRO, an AI-driven robo-advisor, renamed…

Fubon

Brands · Roboto

Fubon Financial Holding (富邦金控) and its flagship retail arm Taipei Fubon Bank (台北富邦銀行) share a design language built on trust, approachability, and Taiwanese banking heritage. The canvas is clean white (#ffffff)…

Gaudio Lab

Brands · Roboto

Gaudio Lab (가우디오랩) is a Korean AI-audio technology company, and its website reads like a research lab that learned restraint from consumer product design. The canvas is almost entirely pure white (#ffffff), sectioned…

iPASS MONEY

Brands · stolzl

iPASS MONEY (一卡通 MONEY) is Taiwan's integrated e-wallet and transit card management platform operated by iPASS Corporation (一卡通票證股份有限公司). Its visual identity is rooted in an energetic, nature-connected green — a hue…

Kyobo Book Centre

Brands · Pretendard

Kyobo Book Centre (교보문고) is a Korean bookseller whose own timeline begins with the founding of 교보문고 주식회사 on 24 December 1980 and the opening of the Gwanghwamun store in June 1981. It has sold remotely for almost as…

MaiCoin / MAX

Brands · Segoe UI

MaiCoin is the largest crypto-exchange group in Taiwan, and its design splits cleanly across two surfaces with two distinct personalities. The consumer-facing buy/sell site (www.maicoin.com) is warm and approachable:…

Neosapience

Brands · Pretendard

Neosapience (네오사피엔스) is the Korean generative-AI lab behind Typecast — emotionally expressive text-to-speech, voice cloning, and AI-avatar synthesis. Its identity lives across two deliberately different surfaces, and…

Nota AI

Brands · Roboto

Nota AI (노타, Nota Inc.) is a Korean on-device AI company whose company page states its mission in four words: "Democratizing the use of AI". Its milestones trace the path. It began in 2015 building an AI tool for…

Pairs (ペアーズ)

Brands · Noto Sans JP

Pairs is a Japanese dating app run by 株式会社エウレカ (Eureka, Inc.) in Tokyo. In May 2015 Match Group, the US online-dating company, acquired Eureka outright and kept Pairs running as its own brand. The stylesheet looks…

Serendie

Brands · Noto Sans JP

Serendie is Mitsubishi Electric's digital-platform brand, and Serendie Design System is the design language its DX Innovation Center publishes for it. The atmosphere is a calm institutional blue on white with…

Sinsang Market (Dealicious)

Brands · Roboto

Dealicious (딜리셔스) runs 신상마켓 (Sinsang Market), the wholesale platform of Seoul's Dongdaemun fashion trade. In its own words, Dealicious "moved the B2B trade of the Dongdaemun fashion industry, which had only ever…

Workday

Brands · Acid Grotesk

Workday is the enterprise cloud platform for HR, finance, and IT, and its public surface reads exactly the way enterprise software wants to be perceived in 2026 — calm, credible, and quietly confident rather than…

YouTube

Brands · Roboto

A dense, video-first grid built for endless discovery. YouTube's public product pairs a neutral white/dark surface with confident red brand accents, thumbnail-driven grids, and a persistent player chrome designed to…

10YC

Japan · Roboto

10YC（https://10yc.jp/）のデザイン仕様書。 2026-05-09 取得の computed style に基づく。

aeru

Japan · Roboto

aeru 公式サイト（https://a-eru.co.jp/）のデザイン仕様書。 「日本の伝統を次世代につなぐ」をミッションに掲げる和える。日本最年少の女性社長が創業し、全国の職人と共に子どもから大人まで使える伝統工芸品を企画・販売する。 実サイトの computed style に基づいて記述。

Autify（オーティファイ）

Japan · Roboto

Autify（オーティファイ）のデザイン仕様書。

Benesse（ベネッセ）

Japan · Roboto

Benesse Corporation（https://www.benesse.co.jp/）のデザイン仕様書。 「よく生きる」を企業理念に掲げる日本の総合教育・生活事業企業。進研ゼミ、こどもちゃれんじ、介護、語学等を展開。 実サイトの computed style 実測（2026-06-09 取得）に基づく。

CAINZ（カインズ）

Japan · Hiragino Kaku Gothic ProN

カインズ（https://www.cainz.com/）のデザイン仕様書。 日本最大級のホームセンターチェーン。オンラインショップと全国200超の店舗を展開。 2021年にデジタル戦略を刷新し、グッドデザイン賞を受賞したEC体験で知られる。 実サイトの computed style 実測（2026-05-09 取得）に基づく。

dentsu (電通)

Japan · Noto Sans JP

dentsu（https://www.dentsu.co.jp/）のデザイン仕様書。 実サイトの computed style に基づく。CSS Custom Properties は未使用。

ITOCHU Corporation (itochu.co.jp)

Japan · メイリオ

ITOCHU Corporation (itochu.co.jp)のデザイン仕様書。

Kanazawa21

Japan · 游ゴシック体

Kanazawa21のデザイン仕様書。

KEWPIE (kewpie.co.jp)

Japan · Roboto

KEWPIE (kewpie.co.jp)のデザイン仕様書。

KIRIN

Japan · Roboto

KIRIN（https://www.kirin.co.jp/）のデザイン仕様書。 2026-05-09 取得の computed style に基づく。 キリングループのコーポレートサイト。ビール・飲料・乳製品を含む総合飲料メーカー。

LOTTE（ロッテ）

Japan · Noto Sans JP

LOTTE（https://www.lotte.co.jp/）のデザイン仕様書。 1948年創業の菓子・食品メーカー。「お口の恋人」をスローガンに、チョコパイ・ガーナ・キシリトール等を展開。 実サイトの computed style 実測（2026-06-18 取得）に基づく。

Mizuno（ミズノ）

Japan · Roboto

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

mybest（マイベスト）

Japan · Roboto

mybest（https://my-best.com/）のデザイン仕様書。 日本最大級の商品比較サービス。自社施設で商品を購入・検証し、ランキング形式でおすすめを紹介する。 実サイトの computed style 実測（2026-06-21 取得、トップページ＋記事ページ）に基づく。

NANGA（ナンガ）

Japan · Roboto

NANGA（https://nanga.jp/）のデザイン仕様書。 滋賀県米原発、高品質な寝袋とダウンウェアを中心としたアウトドアブランド。 実サイトの computed style 実測（2026-06-06 取得）に基づく。

nosh（ナッシュ）

Japan · Noto Sans JP

nosh（ナッシュ）のデザイン仕様書。

NTT docomo

Japan · ヒラギノ角ゴ Pro W3

NTT docomo（https://www.docomo.ne.jp/）のデザイン仕様書。 実サイトの CSS computed style に基づく。日本最大の携帯キャリアのコーポレートサイト。

OMRON (オムロン)

Japan · Roboto + Noto Sans JP

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

RAKSUL（ラクスル）

Japan · Roboto + Hiragino

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

READYFOR（レディーフォー）

Japan · Roboto

READYFOR（https://readyfor.jp/）のデザイン仕様書。 日本初・日本最大級のクラウドファンディングプラットフォーム。社会課題の解決や文化・地域活性化を支援するプロジェクトが中心。 実サイトの computed style 実測（2026-06-21 取得）に基づく。

SHIPS

Japan · Roboto

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

Spiral

Japan · Roboto

Spiral（https://www.spiral.co.jp/）のデザイン仕様書。 槇文彦設計の複合文化施設。ワコール・アートセンターが運営する、南青山のギャラリー・ショップ・カフェの複合拠点。 実サイトの CSS computed style に基づく実測値（2026-05-08 取得）。

Sumitomo Forestry (住友林業)

Japan · 游ゴシック体

住友林業（https://sfc.jp/）のデザイン仕様書。 実サイトの computed style に基づく。住友林業は住宅・建築・木材・再生可能エネルギー事業を展開する総合企業。 明朝体（ディスプレイ）・ゴシック体（本文）・Roboto（英語見出し）の3書体を使い分ける、自然と品格を表現したデザインシステム。

THE（ザ）

Japan · YakuHanJP

THE / THE SHOP ONLINE（https://the-web.co.jp/）のデザイン仕様書。 中川政七商店グループが運営する「THE」のデザインプロダクト EC。 実サイトの computed style 実測（2026-06-23 取得）に基づく。

TOPPAN（TOPPANホールディングス）

Japan · 凸版文久ゴシック Pr6N

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

TRUNK(HOTEL)

Japan · Roboto

TRUNK(HOTEL) 公式サイト（https://trunk-hotel.com/）のデザイン仕様書。 渋谷キャットストリートに位置するブティックホテル。"SOCIALIZING" をコンセプトに掲げ、ホテル・レストラン・ウェディング・イベントを展開。 実サイトの computed style に基づいて記述（2026-05-08 取得）。

Wacom（ワコム）

Japan · Roboto

Wacom（https://www.wacom.com/ja-jp）のデザイン仕様書。 ペンタブレット・液晶ペンタブレットの世界的リーダー。クリエイター向けデジタルツールを提供する日本発テクノロジー企業。 実サイトの computed style 実測（2026-05-21 取得）に基づく。

Yakult（ヤクルト）

Japan · Roboto

Yakult（https://www.yakult.co.jp/）のデザイン仕様書。 乳酸菌飲料「ヤクルト」を中心に、食品・飲料・化粧品を展開する健康企業。 実サイトの computed style 実測（2026-05-31 取得）に基づく。

Other fonts