أنظمة تصميم التقنية المالية

أنظمة تصميم مستخرجة من مواقع التقنية المالية والخدمات المالية: المدفوعات، والخدمات المصرفية، والاستثمار، والعملات المشفّرة، ومنتجات الفوترة. الثقة هي الهدف هنا، لذا توقّع استخدامًا مدروسًا للألوان، وخطوطًا واضحة للأرقام، ونماذج وأزرارًا مصمّمة لتمنح شعورًا بالأمان عند الضغط عليها.

3 أمثلة على DESIGN.md في هذه الفئة، من Klarna، PayPal و Stripe. مستخرجة من الصفحات العامة لكل موقع، وليست إرشادات رسمية للعلامة التجارية. جديد على هذا التنسيق؟ اقرأ ما هو ملف DESIGN.md.

معاينة موقع ⁨Klarna⁩
المال والتقنية المالية

Klarna

يعتمد نظام التصميم لدى Klarna على لون أساسي أزرق داكن راقٍ هو #0b051d، مع ألوان تمييز زاهية، أبرزها اللون الوردي المميز #ffa8cd. يستخدم النظام خطوط Klarna المخصصة إلى جانب خطوط النظام، ويُبرز الزوايا المستديرة إذ تُعد 32px القيمة الأكثر شيوعًا. ويحافظ التصميم على تباين عالٍ لتحقيق إمكانية الوصول، ويوازن بين الطابع المهني والودّ من خلال المسافات الواسعة وتسلسل هرمي واضح للطباعة.

معاينة موقع ⁨PayPal⁩
المال والتقنية المالية

PayPal

PayPal's Dutch homepage uses a bold, consumer-facing design anchored by a vivid sky-blue (#60cdff) hero section with ultra-heavy black display typography (PayPal Pro w900). The navigation is white with black text and two distinct CTA buttons — an outlined "Inloggen" and a filled black "Rekening openen". A dark navy announcement banner sits at the top. The overall language is high-contrast, pill-radius-heavy, and brand-typeface-driven, projecting trust and accessibility for a broad consumer finance audience.

معاينة موقع ⁨Stripe⁩
المال والتقنية المالية

Stripe

يعتمد الموقع التسويقي لشركة Stripe على نظام تصميم محكم يُعرف باسم HDS (Stripe Design System)، ويقوم على الخط المتغير "sohne-var" بأوزان خفيفة تتراوح بين 300 و400، ولوحة ألوان للعلامة التجارية تنتقل من الكحلي العميق إلى النيلي وترتكز على اللون #533afd (Stripe Indigo)، وعلى خلفية تدرج طيفي واسعة تملأ الصفحة في القسم الرئيسي. وتتسم المكونات بزوايا منخفضة الانحناء تتراوح بين 4 و6 بكسل، وبظلال مسطحة أو شبه معدومة، وتُبنى وفق شبكة تباعد أساسية قوامها 8 بكسل. والنبرة العامة حازمة وودودة في آن واحد، إذ تنقل البنية التحتية المالية بطباعة واثقة واستخدام مقتصد للألوان.

جرّبه بنفسك

لا تجد الموقع الذي تحتاج إليه؟

الصق أي رابط لتحصل على ملف DESIGN.md من أي موقع ويب. الألوان والخطوط والمسافات والرموز، جاهزة لسير عملك مع الذكاء الاصطناعي.