Design system
Charte graphique Koality Academy
Les éléments visuels à réutiliser sur tous les supports de communication : flyers, emails, slides, documents.
LOGO
Le logo Koality Academy
Pictogramme koala géométrique inspiré du cube 3D, accompagné du lettrage Academy.
Règles d'usage
Zone de sécurité
Conserver autour du logo une marge équivalente à la hauteur du pictogramme koala.
Taille minimale
Ne pas descendre sous 120 px de largeur à l'écran, 30 mm en impression.
Fonds autorisés
Blanc, beige chaud (#F0EFED) ou navy (version inversée à prévoir). Pas de photo en fond direct.
PALETTE
Les couleurs qui comptent
Cinq tokens, pas plus. Le vert est un accent, pas une couleur de fond.
Navy
#1B2A4A
Titres, boutons, CTA, blocs sombres
Vert
#22C55E
Accent : liens, icônes, badges, CTA
Beige
#F0EFED
Fonds chauds : hero, zones CTA
Blanc
#FFFFFF
Fond des cards, zones aérées
Gris texte
#45464E
Texte courant, descriptions, labels
TYPOGRAPHIE
Deux polices, deux usages
Plus Jakarta Sans pour peser, Manrope pour lire.
Plus Jakarta Sans
700 / 800 — TITRES & CHIFFRES
Tout ce qui doit "peser" : titres de page, titres de section, chiffres clés, prix, numéros d'étape. Toujours en bold ou extra-bold.
Manrope
400 / 700 — CORPS & LABELS
Le reste : paragraphes, descriptions, labels de section, navigation, méta-informations. Regular pour le corps, bold pour les labels uppercase.
MOTIF SIGNATURE
Le cube & les sparkles
Inspiré du logo Koality, à réutiliser tel quel sur les supports.
Quand l'utiliser
Avant un titre de section
Inline avec le label (ex: motif + "CATALOGUE"), centré au-dessus du titre.
Comme séparateur de zone
Centré entre deux blocs, encadré de deux lignes horizontales discrètes.
Au fil conducteur visuel
À saupoudrer sur flyers, slides, emails pour marquer l'identité.
COMPOSANTS
Boutons & badges
Les éléments d'action et de signalement à piocher dans les supports.
BOUTON PRIMAIRE
Fond navy, texte blanc, coins 12px. L'action principale d'une page.
CTA VERT
Fond vert, pill full round, ombre verte diffuse. Pour les conversions clés.
LIEN SOULIGNÉ
Texte navy, soulignement vert épais. Pour les liens de lecture secondaires.
BADGES
Qualiopi Découverte La plus demandée
Pill vert clair pour les certifications et catégories, pill vert plein pour la mise en avant sur fond sombre.