Bibliothèque UI
Fondations visuelles, composants et états d’interface prêts à l’emploi.
Fondations, composants et états d’interface réunis sur une seule page.
Fondations
Une base visuelle simple et lisible.
Fond, surfaces et accent principal.
Une échelle conçue pour le scan rapide.
Eyebrow
Le texte courant reste volontairement compact pour préserver la densité et la lisibilité.
Quelques règles simples pour garder un rendu stable.
Actions et saisie
Actions, champs et sélecteurs partagent les mêmes conventions de taille.
Actions
Variantes principales, tailles et chargement.
Saisie
Des champs lisibles, homogènes et sans variantes inutiles.
Exemple de champ texte standard.
Liste déroulante typée.
Champ multi-ligne avec limite visible.
Statuts et feedback
Badges, loaders et messages signalent un état sans casser la lecture.
Statuts
Une échelle simple pour l’état et la criticité.
Les mêmes conventions sont reprises dans le backlog.
Chargement
Une attente visible, discrète et adaptée au contexte.
Les trois tailles restent lisibles selon la densité de l’écran.
Composition d’écran
Les composants de structure composent une page sans casser la hiérarchie du système.
Structure
Un en-tête réutilisable, complété par des cartes plus compactes pour le détail.
Exemple d’en-tête pour une page métier ou un onglet fonctionnel.
Une carte secondaire pour détailler métriques ou sous-sections.
États
Des composants pour l’absence de données et les confirmations courtes.
Données
Un état vide qui oriente immédiatement vers l’action utile.