Logos, couleurs, typographies et règles d’usage de la marque uh!ive, réunis en un seul endroit. Tout ce qu’il faut pour représenter la marque correctement, en interne comme à l’extérieur.
Logo
Le logo et ses variantes
Quatre formes officielles couvrent tous les usages. Le wordmark pour les contextes larges, la bubble pour les petits formats et les avatars. Respectez les proportions, ne recolorez jamais hors palette.
Zone de protection
Wordmark : 1x la hauteur du h tout autour. Bubble : 0,25x le diamètre. Aucun élément ne pénètre cette zone.
Tailles minimales
Wordmark avec tagline : 140px web, 35mm print. Sans tagline : 80px, 20mm. En dessous, basculez sur la bubble.
Couleurs autorisées
Primary blanc sur fond sombre. Inverted Blueprint 800 sur fond clair. Bubble toujours en Glacier 500.
À faire
- Utiliser les fichiers sources officiels
- Conserver les proportions (homothétie stricte)
- Respecter la zone de protection
- Ajouter le symbole sur les supports officiels
À ne jamais faire
- Déformer, incliner ou pivoter
- Recolorer hors palette ou ajouter un effet
- Séparer le point d’exclamation du i
- Poser le logo sur un fond à faible contraste
Couleurs
Palette officielle
Sept familles, dix nuances chacune, de 50 à 900. Les variables sont la source de vérité : Glacier pour l’accent, Blueprint pour la structure, Obsidian pour les surfaces.
Glacier
Accent signature, couleur interactive
Glacier 50
#eef9fb
Glacier 100
#ccecf1
Glacier 200
#b3e3eb
Glacier 300
#90d6e2
Glacier 400
#7acedc
Glacier 500
#59c2d3
Glacier 600
#51b1c0
Glacier 700
#3f8a96
Glacier 800
#316b74
Glacier 900
#255159
Blueprint
Structure, profondeur, fonds
Blueprint 50
#e8edef
Blueprint 100
#b7c8cf
Blueprint 200
#94adb7
Blueprint 300
#638896
Blueprint 400
#457182
Blueprint 500
#164d63
Blueprint 600
#14465a
Blueprint 700
#103746
Blueprint 800
#0c2a36
Blueprint 900
#09202a
Obsidian
Neutres sombres, code, surfaces
Obsidian 50
#eaebed
Obsidian 100
#bdc1c6
Obsidian 200
#9da3aa
Obsidian 300
#707983
Obsidian 400
#545f6b
Obsidian 500
#293746
Obsidian 600
#253240
Obsidian 700
#1d2732
Obsidian 800
#171e27
Obsidian 900
#11171d
Premium
Violet IA, fonctionnalités avancées
Premium 50
#f7f4fe
Premium 100
#ede4fc
Premium 200
#e3d4fa
Premium 300
#d4c0f7
Premium 400
#c9b4f5
Premium 500
#bfa8f2
Premium 600
#ae98da
Premium 700
#8877aa
Premium 800
#685c83
Premium 900
#504665
Success
Statut positif, validation
Success 50
#ecfdf6
Success 100
#c8f7e3
Success 200
#a8f2d1
Success 300
#7cecb8
Success 400
#67e2ac
Success 500
#52d8a0
Success 600
#4ac392
Success 700
#3a9872
Success 800
#2d7558
Success 900
#235a44
Warning
Erreur, alerte critique
Warning 50
#fdf2f3
Warning 100
#f8d9dd
Warning 200
#f4c4ca
Warning 300
#efa6af
Warning 400
#ea8d98
Warning 500
#d94559
Warning 600
#c63e51
Warning 700
#9b3040
Warning 800
#782531
Warning 900
#5c1c26
Attention
Vigilance, information à signaler
Attention 50
#fefcf0
Attention 100
#fdf6d1
Attention 200
#fcf0b6
Attention 300
#fae690
Attention 400
#f8df74
Attention 500
#f5c858
Attention 600
#dfb650
Attention 700
#ad8e3e
Attention 800
#876e30
Attention 900
#685425
Accessibilité : les nuances 400 et 500 ne sont jamais utilisées en texte sur fond clair (contraste insuffisant). Sur fond sombre de référence, privilégiez les nuances 200 à 400. Ne transmettez jamais une information par la couleur seule.
Typographie
Trois familles, un système
Inter porte l’interface et le web. Montserrat signe le branding et les titres. JetBrains Mono sert le code, la data et l’API.
Échelle de texte (Inter)
Token |
Taille |
Interligne |
Graisse |
|---|---|---|---|
| Display | 72px | 1.05 | 800 |
H1 |
56px | 1.1 | 700 |
H2 |
40px | 1.15 | 700 |
H3 |
28px | 1.25 | 600 |
H4 |
22px | 1.3 | 600 |
H5 |
18px | 1.4 | 600 |
H6 |
15px | 1.5 | 600 |
Lg |
18px | 1.6 | 400 |
Base |
16px | 1.6 | 400 |
Sm |
14px | 1.5 | 400 |
Xs |
13px | 1.5 | 400 |
2xs |
11px | 1.4 | 600 |
Iconographie
Icônes
Le système repose sur la base Lucide, traits cohérents, jamais de texte en image. Trois tailles de référence selon le contexte.
16px
Texte courant, labels
20px
Boutons, champs
24px
Navigation, cards
Couleurs sémantiques alignées sur la palette : Glacier pour l’interactif, Blueprint pour le neutre, sémantiques pour les statuts. Zone cliquable minimum 44x44px.
Téléchargements
Ressources
Tout le matériel de marque, prêt à l’emploi.
Un doute sur un usage ?
La marque uh!ive est un actif protégé. Pour tout usage hors des cas couverts ici, co-branding, support presse ou demande spécifique, contactez l’équipe. Voir aussi notre expertise.