Brand
--color-brand · #5d35e6Al Yassamine UI · v1.0 · Indigo Élan
Design system scolaire, moderne et accueillant.
Une bibliothèque de tokens et composants Tailwind conçue pour composer les pages du thème WordPress sans perdre en cohérence.
Fondations
Palette sémantique
La palette active est choisie dans le Customizer. Les composants consomment ces variables et leurs variantes RGB.
Grille
12 colonnes fluides
Conteneur maximum 1180 px, gouttières 16–32 px et sections verticales 56–104 px.
123456789101112
Typographie
Manrope, claire et expressive
Échelle fluide pour les grands titres, interlignage généreux pour la lecture et graisse renforcée pour les repères.
Réussir demain.
L’école qui fait grandir.
Une pédagogie active et bienveillante.
Texte d’introduction pour présenter une promesse claire avec une lecture confortable.
Texte courant — 15 px / 1.7. Il structure les descriptions, contenus éditoriaux, réponses aux questions et légendes détaillées.
Légende · 12 px · Espacement 0.01 em
Actions
Boutons et liens
Six variantes, trois tailles, état focus visible et mouvement réduit selon les préférences système.
Icônes
Chips & tonalités
Icônes SVG au trait 1,8 px dans un cercle sémantique de 40 px.
Cartes
Programmes & contenus
Même squelette, accent adapté au cycle et zone d’image au ratio constant.
Données & réassurance
Chiffres et bénéfices
Composants lisibles en balayage rapide, avec séparation légère et hiérarchie forte.
1 250+Élèves
80+Enseignants
15Ans d’expérience
95%Réussite
20+Activités
Divulgation progressive
Accordéon
Contrôles natifs accessibles, état exposé via aria-expanded et contenu manipulable au clavier.
De la maternelle au lycée.
Prenez rendez-vous avec les admissions.