フィンテックのデザインシステム
フィンテックや金融のWebサイトから抽出したデザインシステムです。決済、銀行、投資、暗号資産、請求管理の製品が中心です。信頼感が最優先のため、慎重な色使い、読みやすい数字のタイポグラフィ、安心して押せるように設計されたフォームやボタンが見られます。
このカテゴリーには3件のDESIGN.mdサンプルがあります（抽出元：Klarna、PayPalとStripe）。各サイトの公開ページから抽出したもので、公式のブランドガイドラインではありません。初めての方はDESIGN.mdとは何かをご覧ください。
Klarna
Klarnaのデザインシステムは、洗練されたダークネイビーのプライマリーカラー（#0b051d）を基調とし、シグネチャーであるピンク（#ffa8cd）などの鮮やかなアクセントカラーを組み合わせています。カスタムのKlarnaフォントとシステムフォントを併用し、角丸（最も多いのは32px）を強調しています。また、アクセシビリティに配慮して高いコントラストを維持しています。ゆとりのある余白と明確なタイポグラフィの階層によって、プロフェッショナルさと親しみやすさのバランスを取っている点が特徴です。
PayPal
PayPalのオランダ語版ホームページは、鮮やかなスカイブルー（#60cdff）のヒーローセクションを核にした、大胆で消費者向けのデザインです。見出しには超極太のPayPal Pro w900を使い、黒の大きな文字で力強さを出しています。ナビゲーションは白地に黒文字で、アウトラインの「Inloggen」と塗りつぶしの黒い「Rekening openen」という2種類のCTAボタンを備えています。上部には濃紺のお知らせバナーが配置されています。全体として高コントラストで、ピル型の丸みを帯びた角とブランドタイポグラフィを軸にしており、幅広い消費者向け金融サービスの対象者に向けて、信頼感と分かりやすさを伝えています。
Stripe
Stripeのマーケティングホームページは、可変フォント「sohne-var」を軽めのウェイト（300〜400）で用いた、厳密に管理されたデザインシステム（HDS — Stripe Design System）で構成されています。ブランドカラーは濃いネイビーからインディゴにかけてのパレットで、中核には#533afd（Stripe Indigo）を据えています。特徴的なのは、全面に広がるスペクトラム調のグラデーションを用いたヒーローセクションです。コンポーネントは角丸が小さく（4〜6px）、影はフラットからごく控えめな程度に抑えられ、8pxを基準とするスペーシンググリッドに沿って構成されています。全体のトーンは、権威がありながらも親しみやすく、確かなタイポグラフィと控えめな色使いによって、金融インフラストラクチャーを伝えています。
お探しのサイトが見つかりませんか？
URLを貼り付けるだけで、あらゆるWebサイトからDESIGN.mdを取得できます。カラー、タイポグラフィ、スペーシング、トークンを、AIワークフローですぐに使える形で。