Design systems fintech
Des design systems extraits de sites de fintech et de finance : paiement, banque, investissement, crypto et facturation. La confiance est le maître mot : attendez-vous à un usage mesuré de la couleur, à une typographie des chiffres très lisible, et à des formulaires et boutons conçus pour inspirer confiance.
3 exemples de DESIGN.md dans cette catégorie, issus de Klarna, PayPal et Stripe. Extraits des pages publiques de chaque site, pas de chartes de marque officielles. Vous découvrez le format ? Lisez ce qu’est un DESIGN.md.
Klarna
Le système de design de Klarna repose sur un bleu marine très sombre et sophistiqué (#0b051d), associé à des couleurs d'accent vives, dont son rose signature (#ffa8cd). Le système utilise des polices Klarna personnalisées en complément des polices système, privilégie les coins arrondis (32px étant la valeur la plus courante) et conserve un fort contraste pour l'accessibilité. Le design allie professionnalisme et convivialité grâce à des espacements généreux et une hiérarchie typographique claire.
PayPal
PayPal, la page d'accueil néerlandaise, adopte un design affirmé et tourné vers le grand public, ancré dans une section héros bleu ciel vif (#60cdff) avec une typographie d'affichage noire ultra-grasse (PayPal Pro w900). La navigation est blanche avec du texte noir et deux boutons d'action bien distincts : « Inloggen » en contour et « Rekening openen » plein en noir. Une bannière d'annonce bleu marine foncé se trouve en haut de page. L'ensemble repose sur un contraste élevé, des coins très arrondis en forme de pilule et une typographie de marque dominante, qui traduit la confiance et l'accessibilité pour un large public de services financiers grand public.
Stripe
Le site marketing de Stripe repose sur un design system très encadré (HDS, Stripe Design System) construit autour de la police variable « sohne-var » en graisses légères (300–400), d'une palette de marque allant du bleu marine profond à l'indigo, ancrée sur #533afd (Stripe Indigo), et d'un héros signature en dégradé spectral pleine largeur. Les composants ont des rayons faibles (4–6 px), des ombres plates ou très discrètes, et sont structurés selon une grille d'espacement de base de 8 px. Le ton général est autoritaire mais accessible : l'infrastructure financière y est présentée par une typographie assurée et un usage mesuré de la couleur.
Vous ne trouvez pas le site qu’il vous faut ?
Collez une URL pour obtenir le DESIGN.md de n’importe quel site. Couleurs, typographie, espacements et tokens, prêts pour votre workflow IA.