Une bibliotheque d'interface,
referencee element par element.
Chaque variante porte un identifiant court. Pour lancer un projet, il suffit de citer
les references voulues — LND-A2, BTN-C9, palette
orange — et le code correspondant est repris tel quel.
Les categories
Chaque page rassemble un domaine complet, des cas simples aux assemblages prets a coller.
Boutons
Hierarchie, formes, styles visuels, icones, groupes, etats et cas metier.
102 variantesGaleries de documents
Grilles, listes, depot, pieces attendues, visionneuse, etats et cas metier.
38 variantesFormulaires
Champs, etats, choix, mise en page, assistants et recapitulatifs d'erreurs.
20 variantesCartes
Cartes cliquables, avec image, statistiques, dossiers, tarifs, temoignages.
17 variantesTableaux et listes
Tableaux triables, densites, selection, listes, descriptions, pagination.
15 variantesNavigation
En-tetes, barres laterales, onglets, menus, barre du bas, tiroir, pied de page.
14 variantesRetours utilisateur
Bandeaux, notifications, info-bulles, modales, tiroirs, progression.
16 variantesEtats vides et chargement
Premiere utilisation, listes vides, squelettes, erreurs 404 et 500, hors connexion.
15 variantesBlocs de landing page
Bannieres, reassurance, prestations, parcours, preuves, questions, conversion.
14 variantesTableaux de bord
Compteurs, histogrammes, courbes, classements, anneaux, panneaux d'activite.
14 variantesThemes et palettes
Six palettes, jetons de couleur, typographie, espacement, rayons, ombres, mouvement.
14 variantesTemplates CRM
Huit identites visuelles completes x six ecrans : liste, fiche, tableau de bord, saisie, planning, documents.
52 variantesMouvement
Revelations au defilement, parallaxe, sections empilees, transitions de page, compteurs.
14 variantesTypographie
Echelle fluide, titres demesures, lettrines, colonnes, citations, piles et couples de polices.
15 variantesTextures et atmospheres
Grain, degrades en mesh, motifs, halos, formes organiques, duotone, ombres colorees.
12 variantesMises en page expressives
Grilles rompues, debordements, superpositions, bento, ecran partage, cartes empilees.
10 variantesEffets avances
Degrade fluide WebGL, champ de points, particules, ondes, revelation au curseur, texte en trame.
8 variantesAnimations
Micro-interactions, transitions d'etat, traces SVG, attentes, attention, texte anime.
27 variantesPatterns produit
Palette de commandes, edition en ligne, facettes, vues enregistrees, kanban, visite guidee.
14 variantesInterfaces d'IA
Fil de conversation, streaming, sources citees, raisonnement, actions en ligne, retours.
12 variantesCodes de signature
Champs de code SMS ou courriel pour la signature electronique : styles de cases, etats, parcours complets.
23 variantesCSS moderne
Popover, ancrage de position, :has(), @scope, container queries, field-sizing, lanes, if().
12 variantesComment s'en servir
Parcourir
Basculez la palette et le theme en haut a droite pour voir chaque variante dans le contexte reel du projet vise.
Relever la reference
Un clic sur l'identifiant d'une fiche le copie. Le code se deplie sous la fiche, en HTML, CSS et Tailwind.
Demander
« Nouvelle landing page plombier, palette orange, banniere LND-A2, boutons BTN-C9, contact LND-C2. »
Installer dans un projet
<link rel="stylesheet" href="css/theme.css">
<link rel="stylesheet" href="css/components/buttons.css">
<body data-palette="orange" data-theme="light">
<button class="btn btn--plein btn--lg">Demander un devis</button>theme.css ne contient que des variables : changer de palette ne demande
jamais de toucher a un composant. Six palettes, deux themes, et tout le catalogue suit.
Ce qui est tenu partout
- Cible tactile de 44 px minimum sur ecran tactile.
:focus-visiblevisible, jamais neutralise.- Les etats passent par les attributs ARIA, pas seulement par une classe.
- L'information n'est jamais portee par la seule couleur.
- Aucun defilement horizontal : les tableaux deviennent des cartes.
prefers-reduced-motioncoupe les animations sans casser la mise en page.- Ni police obligatoire, ni bibliotheque, ni etape de build.
Au-dela du web
Les memes variantes, dans les autres technos.
code/*.swiftcode/*.ktcode/*.jsxcode/tailwind-*.md