Pourquoi les sites v0 ressemblent-ils tous à shadcn/ui par défaut ?

Cette ressemblance n'est pas un bug de v0. C'est ce qu'on obtient quand une très bonne bibliothèque de composants est utilisée sans toucher à ses réglages.

• shadcn/ui comme base. Les composants sont copiés dans votre projet et stylés via un petit jeu de variables CSS pour le fond, le premier plan, la couleur principale, les tons atténués, les bordures et l'arrondi. Laissés à leurs valeurs par défaut, tous les projets reçoivent la même palette neutre et les mêmes coins.
• L'échelle par défaut de Tailwind. Les espacements, les tailles de texte et les ombres viennent de la même échelle sur chaque projet, si bien que même les sections sur mesure ont un air familier.
• Un brief en forme de composants. v0 est très bon pour « une section de prix à trois paliers » et « un hero avec un appel à l'action », donc les pages s'assemblent à partir de ces blocs-là, exactement, dans l'ordre où on les demande.
• Le texte comme bouche-trou. Le texte généré est là pour montrer que la mise en page fonctionne. « Tout ce qu'il vous faut pour passer à l'échelle » est du remplissage, et il part en ligne plus souvent que quiconque ne le voudrait.

Rien de tout cela n'est difficile à défaire. L'essentiel tient dans un fichier CSS et un paragraphe de prompt.

IntentGrid réécrit le texte qu'un visiteur lit : titres, corps de texte, descriptions de fonctionnalités et libellés des boutons, écrits pour la façon dont cette personne est arrivée (source de trafic, campagne, ville approximative, appareil, langue, heure locale). Il part du texte déjà présent sur votre page, et les noms de marque, les prix, les dates et les chiffres sont sur une liste à ne pas toucher.

Il laisse vos composants shadcn/ui, vos variables de thème, vos classes Tailwind et votre mise en page exactement tels quels. Il ne touche pas à votre projet v0, et il ne donnera pas un air sur mesure à un style par défaut : c'est un changement de thème, traité plus bas.

La partie qui fonctionne aujourd'hui est une démo qui affiche une copie réécrite de n'importe quelle URL publique dans un bac à sable sur intentgrid.ai ; l'adaptation sur votre propre domaine est en accès anticipé, mise en place site par site à la main. Comment ça marche explique la différence.

Un projet v0 déployé comme application Next.js rend ses pages côté serveur ou au moment du build, y compris les composants marqués comme composants client : le texte se trouve donc dans la réponse HTML et la démo peut le réécrire. Collez l'URL publique du site déployé, pas un lien vers le chat ou l'éditeur v0.

Les exceptions sont les mêmes que dans n'importe quelle application React : le texte récupéré dans le navigateur après le chargement de la page, et le contenu qui ne s'affiche qu'après un clic, comme un onglet pas encore ouvert, une fenêtre fermée ou une diapositive suivante d'un carrousel. La démo retire les scripts, donc elle voit la page telle qu'elle arrive au départ.

Mêmes composants, mêmes prix, mêmes promesses. Chaque version n'utilise que ce que la page d'origine dit déjà : dans ce cas inventé, des notes automatiques, des transcriptions et des actions extraites.

L'essentiel de l'allure v0 tient à deux ou trois fichiers et à une habitude.

• Changez les variables du thème. Choisissez votre propre couleur principale, votre fond, vos bordures et votre arrondi dans les variables CSS que lit shadcn/ui. C'est le plus grand changement visuel pour la plus petite modification.
• Remplacez la police par défaut. Un import et une variable, et la page cesse de ressembler à un kit de démarrage.
• Demandez à v0 une section qui ne soit pas une grille de cartes : une seule grande capture d'écran du produit, une liste comparative, la citation d'un vrai utilisateur. Une seule section inhabituelle donne au reste l'air d'avoir été choisi.
• Donnez au prompt un lecteur, pas une liste de composants. Dites à qui s'adresse la page et ce que ces gens utilisent aujourd'hui, et demandez un texte qui le nomme.
• Supprimez le remplissage. Cherchez dans la page « tout ce qu'il vous faut », « fluide », « puissant » et « à grande échelle », et réécrivez chaque phrase qui en contient un.

Les raisons pour lesquelles les choix par défaut convergent d'un outil d'IA à l'autre, et les autres corrections de design, sont détaillées dans pourquoi les sites vibe codés se ressemblent.