Le logo, l'icône, les couleurs et la typographie. Le « i » et le « a » du logotype sont toujours en bleu vif, quel que soit le fond.
01
Logo
i/a toujours bleu #4A9EFF
Sur fond clair
Sur fond navy
Le logotype porte le nom : signature de document, header de site, en-tête de post, présentation. Sur fond clair il est navy, sur fond navy il est blanc. Le i et le a restent bleus dans les deux cas.
Pour l'imprimeur : PDF vectoriel, en CMJN, à l'échelle. Le SVG et le PNG ci-dessus sont pour l'écran.
Rien n'entre dans cette marge : ni texte, ni image, ni bord de page, ni autre logo. C'est la même règle pour l'icône, avec une marge égale au quart de sa largeur.
Taille minimale
En dessous, les détails de marque disparaissent.
Logotype, écran
110 px
de large
Logotype, impression
25 mm
de large
Icône, écran
24 px
de côté
Icône, impression
8 mm
de côté
Le plancher du logotype est fixé par le i et le a : sous 110 px de large, leur fût descend sous 3 px et le bleu se brouille. Celui de l'icône est fixé par l'anneau de la loupe, qui se referme visuellement en dessous de 24 px. Le favicon 16 px est la seule exception, assumée, parce qu'aucun navigateur ne propose mieux.
01
Fonds
Ce sur quoi le logotype se pose, et ce qu'il évite
Blanc
Blanc cassé
Navy
Lime, non
Bleu vif, non
Dégradé, non
Le logotype vit sur du blanc, du blanc cassé ou du navy. Sur lime, le i et le a tombent à 2,3:1 de contraste et l'accent s'éteint. Sur bleu vif, il disparaît complètement puisque c'est sa propre couleur. Sur un dégradé ou une photo non traitée, la lisibilité dépend de l'endroit où le logo tombe, donc elle n'est pas garantie : posez un aplat navy ou blanc derrière, ou utilisez l'icône.
01
Logo animé
Site et signatures mail
Fond clair
Fond sombre
Deux GIF, hébergés sur le site : logo-anime-light.gif pour un fond clair, logo-anime-dark.gif pour un fond navy. Servent d'en-tête de signature mail et sur le site. Un seul logo animé par support, et jamais dans un visuel qui contient déjà une autre animation. Partout ailleurs (posts, documents, print), on utilise le logo fixe.
02
Icône
Le logo et l'icône ne vivent jamais ensemble
Officielle, externe
Interne, fond clair
Interne, fond sombre
Pour l'imprimeur : PDF vectoriel, en CMJN, à l'échelle.
L'icône représente la marque quand il n'y a pas la place d'écrire son nom : avatar de réseau social, favicon, application, tampon, pastille. Version officielle vers l'extérieur : le pin blanc cassé sur le carré bleu vif. C'est celle qu'on utilise partout où le public nous voit. En interne (favicon des outils, docs, environnements de travail), on utilise le pin monochrome qui suit le thème : navy sur fond clair, blanc sur fond sombre. Une icône ou un logotype par visuel, jamais les deux côte à côte.
03
Couleurs
Navy pour le fond, lime pour l'action
03
Pour l'impression
Le Lab fait référence, le CMJN est indicatif
Couleur
Lab (D50)
CMJN couché
CMJN non couché
Navy
14,5 / -7 / -17
96 78 46 56
100 80 44 49
Navy secondaire
19,6 / -8 / -19
93 73 43 43
100 78 42 38
Lime
92,9 / -26 / 56
25 0 65 0
20 0 61 0
Bleu vif
63,5 / -2 / -57
64 35 0 0
67 33 0 0
Accent
41,6 / -14 / -27
85 52 26 5
89 50 24 5
Blanc cassé
96,9 / -1 / -1
4 2 2 0
4 2 2 0
Donnez le Lab à votre imprimeur, pas le CMJN. Le Lab décrit la couleur elle-même, indépendamment du papier et de la presse. Le CMJN, lui, n'a de sens que pour un couple papier plus presse donné. Les valeurs ci-dessus sont converties depuis le sRGB vers Coated FOGRA27 et Uncoated FOGRA29, en colorimétrie relative avec compensation du point noir. Elles servent de point de départ, pas de référence contractuelle : c'est l'épreuve validée qui fait foi. Deux points de vigilance : le bleu vif sort du gamut CMJN et rendra toujours plus terne sur papier qu'à l'écran, et le navy monte à 276 % d'encre totale, à surveiller en numérique et sur papier non couché.
Pour les développeurs : les mêmes couleurs en variables, à importer plutôt qu'à recopier.
Toute la marque est en Geist : web, print, présentations, visuels. Une seule famille, trois graisses. Licence SIL Open Font 1.1, libre d'usage et redistribuable, les fichiers sont dans le kit.
Graisses
Regular 400Medium 500SemiBold 600
Rien au-dessus de 600 : ni Bold, ni Black. Pas d'italique.
Logotype 600 · -5%
Display 500 · -3%
Un interlocuteur unique pour votre visibilité.
Corps 400 · 1.6
Google, ChatGPT, fiche d'établissement, Instagram : une présence suivie au même endroit, par la même équipe.
Label 500 · +16%
Le conseil de la semaine
Le logotype ne se retape pas. Il est vectorisé, c'est un tracé, pas du texte en Geist : utilisez toujours les fichiers fournis. Dans les emails, Geist ne se charge pas (aucun client mail ne charge de police externe de façon fiable) : les signatures et templates déclarent 'Geist',Arial,Helvetica,sans-serif, et retombent donc sur Arial chez le destinataire. C'est voulu, ne cherchez pas à forcer.
Pour le print et la bureautique (InDesign, Illustrator, Word, Google Docs) : les TTF.
Un seul jeu d'icônes : Phosphor, style duotone, licence MIT, teinté en accent #1E6A8E, la couche de fond gardant son opacity 0.2. Besoin d'une icône absente de la liste ? Prenez-la sur phosphoricons.com en duotone et appliquez la même teinte, ne la dessinez pas et ne mélangez pas deux bibliothèques. Dans les emails, les icônes sont des <img> de 18 px, jamais des background-image : Outlook ne les afficherait pas. En thème sombre, la teinte passe au bleu vif, comme les surtitres.
Utiliser le logotype ou l'icône tels que fournis ici, pour indiquer un partenariat réel et en cours.
Choisir la version adaptée à votre fond : navy sur clair, blanc sur foncé. Le i et le a restent bleus.
Afficher notre logo à une taille au plus égale à la vôtre, avec sa zone de protection.
Nous nommer en texte : Futur Digital, deux mots, deux majuscules, sans tiret et sans autre graphie.
Ce que vous ne pouvez pas faire
Recolorer, déformer, incliner, détourer, ajouter une ombre, un contour ou un effet.
Retaper le nom dans une autre police, ou reconstruire le logotype à la main.
Intégrer notre logo ou notre pin dans le vôtre, ni en composer un verrou visuel commun.
Laisser entendre une recommandation, une certification ou une exclusivité qui n'existe pas.
Poser notre logo sur du lime, du bleu vif, un dégradé ou une photo non traitée.
En cas de doute, demandez avant de publier. Une validation prend moins de temps qu'un retrait. Passez par votre interlocuteur Futur Digital habituel, avec la maquette où le logo apparaît. Les fichiers de cette page sont les seuls officiels : si vous avez récupéré un logo ailleurs, dans une vieille présentation ou sur un moteur de recherche, il est probablement périmé, et notre rouge historique ne fait plus partie de la marque.
07
Règles rapides
À faire
Le lime sur ce qui doit trancher : bouton d'action, highlight, trait, grand chiffre. Un seul accent par visuel.
À faire
Le i et le a du logotype toujours en bleu vif. Le reste du tracé s'adapte au fond : navy sur clair, blanc sur navy.
À faire
Vers l'extérieur, l'icône officielle est le pin blanc cassé sur carré bleu. En interne, le pin monochrome selon le thème.
À éviter
Le lime en petit texte : contraste trop faible, réservez-le aux grandes tailles et aux aplats.
À éviter
Le logotype et l'icône ensemble dans le même visuel : c'est l'un ou l'autre.
À éviter
Déformer, recolorer ou re-typographier le logo : utilisez toujours le tracé fourni.
Pour créer des posts : le studio de gabarits (Instagram, LinkedIn) est un outil séparé, avec l'export PNG.
Noms de fichiersGardez ceux du kit, par exemple fd-logo-navy@2x.png
CréditsGeist sous licence SIL Open Font 1.1, icônes Phosphor sous licence MIT