# Nous avons lu 150 dépôts shadcn/ui. L’uniformité ne vient pas du violet. Premier démontage. Les projets shadcn/ui les plus étoilés utilisent deux polices et une couleur principale grise. Le violet vient d’ailleurs. https://laithjunaidy.com/fr/writing/taken-apart-shadcn-defaults Par Laith Aljunaidy. Publié: 2026-09-25. --- ![Graphiques des 150 dépôts shadcn/ui les plus étoilés : 88 pour cent utilisent Geist ou Inter, 75 pour cent une couleur principale neutre](https://laithjunaidy.com/writing/taken-apart-1/chart.png) Tous ceux qui développent avec l’IA connaissent ce style : une police, un dégradé violet, les mêmes cartes arrondies. On accuse généralement shadcn/ui, qui sert de base à tant de ces applications. J’ai donc arrêté de deviner et lu le code. ## Ce que j’ai mesuré J’ai pris les 150 dépôts GitHub les plus étoilés portant le tag `shadcn-ui`, le 25 septembre 2026. Pour chacun, j’ai lu les fichiers qui déterminent l’apparence : mise en page racine, configuration Tailwind et feuille de style globale. J’ai relevé deux éléments. - **La police**, à partir des imports `next/font`, des liens Google Fonts et des déclarations `font-family`. - **La couleur principale**, à partir de la première valeur correspondante dans la feuille de style, classée par teinte : neutre, bleu, violet ou autre. Lorsqu’une information était illisible, le dépôt était compté comme tel, sans supposition. Il reste ainsi 67 dépôts avec une police identifiable et 87 avec une couleur principale identifiable. ## Deux polices dominent 59 des 67 dépôts dont la police est identifiable utilisent **Geist ou Inter**. Soit 88 pour cent. Geist apparaît dans 34, Inter dans 28, et certains chargent les deux. Seuls 8 ont choisi autre chose : DM Sans, Manrope, Sora, Montserrat et quelques autres. Voilà la véritable uniformité. Geist et Inter sont d’excellentes polices d’écran. Mais le premier élément que le lecteur voit est identique dans presque tous ces produits. ## Une couleur principale grise, pas violette 65 des 87 couleurs principales identifiables sont **neutres** : presque noires ou grises, directement issues des palettes de base de shadcn. Soit 75 pour cent. Le bleu représente 11 cas, ou 13 pour cent. Le violet, 5 cas, ou 6 pour cent. Le violet ne vient donc pas de shadcn/ui. Sans modification, la bibliothèque livre du gris. Si votre produit est violet, quelqu’un l’a choisi, ou un outil l’a choisi à votre place. ## Ce que cela signifie pour concevoir avec l’IA La bibliothèque de composants n’est pas la cause du problème de marque. Elle fournit volontairement une structure et une base neutre. L’uniformité apparaît à deux endroits : la police que personne n’a changée et la couleur d’accent choisie par un outil sans consigne. Chacun demande une décision. Choisissez une police qui porte votre voix, définissez votre couleur principale et donnez-les au modèle avant qu’il ne dessine. Voilà la correction. C’est pourquoi le système de design doit venir en premier. ## Méthode et données Le scanner, les règles et les résultats bruts sont ouverts : [scan_shadcn.py](https://laithjunaidy.com/writing/taken-apart-1/scan_shadcn.py) et [results.json](https://laithjunaidy.com/writing/taken-apart-1/results.json). Les groupes de teintes utilisent HSL (violet de 240 à 300 degrés) et OKLCH (violet de 265 à 320 degrés). Toute saturation inférieure à 12 pour cent ou chroma inférieure à 0.05 est considérée comme neutre, ce qui correspond aux bases slate et zinc de shadcn. L’échantillon comprend les 150 dépôts les plus étoilés portant le tag, bibliothèques et applications comprises. Le dépôt médian compte environ 1,700 étoiles. Voici le premier **Démontage** : une question de design, mesurée à la main, méthode à l’appui. Si vous souhaitez faire mesurer une question, [dites-le-moi](https://laithjunaidy.com/contact).