Design system · 19 avril 2026

FinTech Verte / Épargne Accessible & Engagée

Accessible, dynamique, engagé, optimiste, moderne

Palette

Note du directeur artistique

Ce système visuel opère une rupture franche avec les codes visuels historiques de la finance — exit le bleu marine autoritaire, le gris fiduciaire, le serif solennel. Ici, le vert est choisi dans sa version la plus vive, presque crue, celle du printemps et du renouveau : il ne s'agit pas d'un vert sage qui rassure, mais d'un vert qui affirme, qui prend de la place, qui dit "quelque chose a changé". Ce vert dialogue directement avec le noir d'encre des titres en créant une tension maximale, un contraste qui rend chaque prise de parole urgente et désirable. La déclinaison dark de Green Got — un vert nuit, presque kaki profond — montre que la palette est architecturale : elle peut être aussi douce que percutante selon la valeur tonale. Le choix typographique d'un grotesque extra-bold pour les displays (dans l'esprit Syne ou Space Grotesk) est délibérément anti-corporate : cette catégorie de caractères évoque autant le branding streetwear que les startups tech de nouvelle génération. Elle dit à l'utilisateur "nous ne sommes pas votre banque habituelle". Couplée à un Inter fonctionnel et neutre pour le corps, elle crée une hiérarchie immédiatement lisible où les chiffres clés (200K, 4.5/5) deviennent de véritables sculptures typographiques, presque des éléments graphiques à part entière. Ce système permet de construire une communication qui émancipe : l'utilisateur n'est plus face à un expert financier condescendant, mais embarqué dans une aventure collective, rassurante et enthousiasmante. L'émotion installée est celle de la confiance joyeuse — non pas la confiance froide d'une institution, mais celle que l'on a envers un ami compétent qui nous veut du bien.

/* ── FinTech Verte / Épargne Accessible & Engagée — Design Tokens ── */
/* Généré par Moodcast */
:root {
  /* ── Colors ── */
  --color-primary: #6EE03A;
  --color-primary-light: #A8F060;
  --color-secondary: #1A2E0A;
  --color-ink: #111111;
  --color-background: #FFFFFF;
  --color-background-hero: #72E33C;
  --color-muted: #555555;
  --color-border: #D9D9D9;
  /* ── Typography ── */
  --font-display: 'Syne', sans-serif;
  --font-body:    'Inter', sans-serif;
  /* ── Border radius ── */
  --radius-sm: 100px;
  --radius-md: 100px;
  --radius-lg: 100px;
  --radius-xl: 100px;
}

Made with Moodcast

Ton moodboard → un design system complet.

Importe tes images d'inspiration. Claude analyse, extrait la palette, les typos et le vibe — et génère un fichier design.md prêt à coller dans ton projet.