# Les classes Tailwind ne s'appliquent pas dans l'aperçu (/fr/help-center/tailwind-classes-not-applying-in-editor-preview)

<!-- agent-signals: reading_time_min: 2 · est_tokens: 713 · updated: 2026-09-23 -->

Si une page stylisée avec des classes Tailwind CSS, comme une page de destination en [mode personnalisé](/fr/organize/pages#custom), semble sans style dans l'[aperçu en direct](/fr/editor/review#live-preview) de l'éditeur web, votre balisage est probablement correct. L'aperçu en direct affiche votre contenu sans étape de build et ne génère pas le CSS des classes Tailwind propres à une page.

<div id="why-the-live-preview-looks-unstyled">
  ## Pourquoi l'aperçu en direct semble sans style [#pourquoi-laperçu-en-direct-semble-sans-style]
</div>

Mintlify analyse chaque page à la recherche de classes Tailwind et génère le CSS correspondant lors du build du site. Les builds s'exécutent pour les déploiements en production, les [déploiements de prévisualisation](/fr/deploy/preview-deployments) et les prévisualisations locales avec [`mint dev`](/fr/cli/commands#mint-dev). L'aperçu en direct saute l'étape de build afin de pouvoir s'afficher instantanément ; le CSS de vos classes Tailwind n'y est donc jamais généré.

Si vous inspectez un élément dans l'aperçu en direct, les classes Tailwind apparaissent dans le HTML avec un préfixe `mint-`, mais aucune règle CSS ne leur correspond.

<div id="see-your-styles-rendered-accurately">
  ## Voir vos styles rendus fidèlement [#voir-vos-styles-rendus-fidèlement]
</div>

Pour vérifier le rendu d'une page stylisée avec Tailwind, utilisez une prévisualisation qui inclut un build :

* Exécutez [`mint dev`](/fr/cli/commands#mint-dev) dans votre dépôt local.
* Enregistrez vos modifications sur une branche et ouvrez une pull request. Mintlify génère un [déploiement de prévisualisation](/fr/deploy/preview-deployments) avec une URL partageable.
* Publiez vos modifications et vérifiez votre site en ligne.

Si la page semble toujours incorrecte dans l'une de ces prévisualisations, le problème vient de la page elle-même. Consultez [Créer des mises en page personnalisées](/fr/guides/custom-layouts) pour des modèles fonctionnels.

<div id="custom-mode-pages-have-no-default-typography">
  ## Les pages en mode personnalisé n'ont pas de typographie par défaut [#les-pages-en-mode-personnalisé-nont-pas-de-typographie-par-défaut]
</div>

Indépendamment du comportement de l'aperçu en direct, le mode personnalisé est une toile vierge. Mintlify n'applique pas sa typographie par défaut aux pages en mode personnalisé ; les éléments HTML natifs comme `<h2>` et `<p>` s'affichent donc avec les styles par défaut du navigateur sur chaque prévisualisation et chaque déploiement. Stylisez-les explicitement :

```mdx title="Example styled heading"
<h2 className="text-2xl font-semibold text-gray-900 dark:text-zinc-50">
  Features
</h2>
```

Il s'agit d'un comportement attendu, pas d'un bug de rendu. Consultez [Créer des mises en page personnalisées](/fr/guides/custom-layouts) pour des exemples complets.