# Générateur de thème WordPress IA gratuit pour block themes

URL: https://noonwp.com/fr/tools/generateur-theme-wordpress-ia
Type: tool
Locale: fr
Published: 2026-10-21
Updated: 2026-10-25

---

> Générez une palette contrôlée en contraste, une échelle typographique et un theme.json prêt pour votre block theme WordPress, à partir d'une seule couleur de marque. Gratuit, dans le navigateur.

## Générez une palette theme.json et une échelle typographique en quelques secondes

Ce générateur de thème WordPress IA promet souvent un site entier. Celui-ci fait la partie que vous pouvez vérifier : une palette contrôlée en contraste, une échelle typographique modulaire et un theme.json prêt pour votre block theme.

## Générateur de thème de départ pour block theme

Choisissez une couleur de marque, un mode et une association de polices. La palette, le rapport de contraste et le theme.json se mettent à jour à chaque modification.

*[Interactive widget — see the live page for the full experience]*

## Ce que le générateur calcule réellement

### Une palette à partir d'une couleur

Votre couleur de marque devient Primary. L'outil en lit la teinte et construit Base, Surface et Contrast à partir d'elle en HSL, à 97 %, 93 % et 11 % de luminosité sur une base claire, ou 9 %, 14 % et 92 % sur une base sombre. Accent se place à 150 degrés sur la roue chromatique.

### Un contraste vérifiable

Quatre paires sont mesurées avec la formule de luminance WCAG 2.x : texte courant, lien, texte de bouton et accent. Chacune reçoit un ratio et une note. Si le lien échoue au niveau AA, sa luminosité change d'un cran à la fois jusqu'à le réussir.

### Une échelle typographique modulaire

Medium vaut 1rem. Large, extra large et huge multiplient par votre ratio une, deux puis trois fois, et small le divise. Avec le ratio 1.2, vous obtenez 0.833, 1, 1.2, 1.44 et 1.728 rem.

*Marginalia*

## Pourquoi les tokens de design passent avant les patterns

Un pattern de hero, une grille de cartes et un pied de page lisent tous les mêmes slugs de palette. Si ces slugs portent des valeurs qui échouent au contraste, chaque pattern hérite de l'échec, et vous le découvrez sur le téléphone du client. Corriger les tokens d'abord fait que les patterns que vous construisez, ou générez avec Pattern Forge, partent de couleurs qui passent déjà. Testez le résultat sur un vrai site client, pas sur un bac à sable.

- Les slugs de palette sont partagés par chaque bloc et pattern
- Les slugs de taille de police gardent les titres cohérents entre les templates
- Une seule modification de theme.json met à jour tout le site

## Du fichier généré au thème en ligne

1. **Choisir les entrées** — Partez de la couleur de marque tirée du logo du client. Choisissez un mode clair, sauf si la marque est sombre par nature, puis l'association de polices qui correspond au ton.
2. **Lire le rapport de contraste** — Repérez les lignes marquées Échec ou Grand texte uniquement. Modifiez le fond ou la teinte neutre jusqu'à ce que le texte courant, le lien et le texte du bouton réussissent tous le niveau AA.
3. **Copier le fichier dans votre thème** — Cliquez sur Copier theme.json, collez le contenu à la racine de votre block theme, puis ouvrez l'éditeur de site et vérifiez que la palette apparaît dans le sélecteur de couleurs.
4. **Affiner à la main** — Le résultat sert de point de départ. Renommez les slugs selon votre système de design, ajoutez les réglages d'espacement et de mise en page, puis versionnez le fichier avec le reste du thème.

## Ce que cet outil ne fait pas

### Pas de mises en page

Il produit des tokens, pas des templates. L'en-tête, le pied de page et la structure des pages viennent toujours de votre block theme ou des patterns que vous construisez dans l'éditeur de site.

### Pas de polices web

Les deux associations utilisent des piles système pour éviter toute requête de police. Une typographie de marque demande une police variable auto-hébergée et une entrée fontFace, que vous ajoutez vous-même.

### Pas de garantie de goût

Une palette peut réussir chaque contrôle de contraste et paraître plate. Considérez le résultat comme une base sûre, puis ajustez Accent et les neutres à l'œil sur une vraie page.

## Questions sur le générateur

### Est-ce vraiment un générateur de thème IA ?

Non, et l'outil le dit d'entrée. La palette, les contrôles de contraste et l'échelle typographique viennent de règles fixes : calcul des couleurs en HSL, formule de contraste WCAG et échelle modulaire. Le résultat reste ainsi prévisible et testable. Si vous voulez un modèle de langage dans la boucle, Pattern Forge génère des patterns Gutenberg à partir d'une consigne ; cet outil couvre les tokens de design qui se trouvent dessous.

### Est-ce gratuit, et mes couleurs sont-elles stockées ?

C'est gratuit et sans compte. Tout fonctionne dans votre navigateur. Le seul envoi est un compteur anonyme qui enregistre l'utilisation de l'outil, sans aucune valeur de couleur ni texte du formulaire.

### D'où vient le ratio de contraste ?

De la formule de luminance relative WCAG 2.x : chaque canal sRGB est linéarisé, pondéré à 0.2126, 0.7152 et 0.0722, et le ratio vaut (plus clair + 0.05) divisé par (plus sombre + 0.05). 4.5 pour 1 est le seuil AA du texte courant, 7 pour 1 le seuil AAA, et 3 pour 1 le seuil AA du grand texte.

### Pourquoi la couleur du lien diffère-t-elle de ma couleur de marque ?

Une couleur de marque échoue souvent au seuil de 4.5 pour 1 sur un fond presque blanc ou presque noir. Le générateur garde votre couleur de marque comme Primary, pour les boutons et les aplats, et ajuste sa luminosité d'un cran à la fois jusqu'à ce que la variante Link réussisse le niveau AA sur le fond choisi.

### Quelle version de WordPress le fichier cible-t-il ?

Le fichier utilise theme.json en version 3, introduite avec WordPress 6.6 (juillet 2024). Les installations plus anciennes peuvent exiger la version 2, qui a la même structure de palette et de typographie : vous pouvez changer le numéro et garder le reste.

### Les piles de polices chargent-elles quoi que ce soit depuis le web ?

Non. Les deux associations utilisent des piles système et de type Georgia, donc aucune requête de police et aucun décalage de mise en page lié à une police web tardive. Si vous auto-hébergez plus tard une police variable, remplacez les valeurs fontFamily et gardez les slugs.

### Fonctionne-t-il pour les sites de droite à gauche ?

Le fichier ne contient aucune valeur gauche ou droite : couleurs, tailles et familles de polices sont indépendantes du sens d'écriture. Vérifiez séparément votre police de repli pour l'arabe ou l'hébreu, car les piles système varient selon les plateformes.

### Où placer le fichier dans mon thème ?

Enregistrez-le sous le nom theme.json à la racine d'un block theme, puis ouvrez l'éditeur de site. Les entrées de palette apparaissent dans le sélecteur de couleurs, les tailles dans le panneau typographie, et la section styles définit les valeurs par défaut de tout le site.

## Passez les tokens à un pattern, pas à une page blanche

Une fois le theme.json en place, Pattern Forge rédige des patterns Gutenberg qui utilisent votre palette et votre échelle typographique. Monk est gratuit ; Scribe coûte $12/mo.

*Call to action: Illuminez votre site*


## FAQ

### Est-ce vraiment un générateur de thème IA ?

Non, et l'outil le dit d'entrée. La palette, les contrôles de contraste et l'échelle typographique viennent de règles fixes : calcul des couleurs en HSL, formule de contraste WCAG et échelle modulaire. Le résultat reste ainsi prévisible et testable. Si vous voulez un modèle de langage dans la boucle, Pattern Forge génère des patterns Gutenberg à partir d'une consigne ; cet outil couvre les tokens de design qui se trouvent dessous.

### Est-ce gratuit, et mes couleurs sont-elles stockées ?

C'est gratuit et sans compte. Tout fonctionne dans votre navigateur. Le seul envoi est un compteur anonyme qui enregistre l'utilisation de l'outil, sans aucune valeur de couleur ni texte du formulaire.

### D'où vient le ratio de contraste ?

De la formule de luminance relative WCAG 2.x : chaque canal sRGB est linéarisé, pondéré à 0.2126, 0.7152 et 0.0722, et le ratio vaut (plus clair + 0.05) divisé par (plus sombre + 0.05). 4.5 pour 1 est le seuil AA du texte courant, 7 pour 1 le seuil AAA, et 3 pour 1 le seuil AA du grand texte.

### Pourquoi la couleur du lien diffère-t-elle de ma couleur de marque ?

Une couleur de marque échoue souvent au seuil de 4.5 pour 1 sur un fond presque blanc ou presque noir. Le générateur garde votre couleur de marque comme Primary, pour les boutons et les aplats, et ajuste sa luminosité d'un cran à la fois jusqu'à ce que la variante Link réussisse le niveau AA sur le fond choisi.

### Quelle version de WordPress le fichier cible-t-il ?

Le fichier utilise theme.json en version 3, introduite avec WordPress 6.6 (juillet 2024). Les installations plus anciennes peuvent exiger la version 2, qui a la même structure de palette et de typographie : vous pouvez changer le numéro et garder le reste.

### Les piles de polices chargent-elles quoi que ce soit depuis le web ?

Non. Les deux associations utilisent des piles système et de type Georgia, donc aucune requête de police et aucun décalage de mise en page lié à une police web tardive. Si vous auto-hébergez plus tard une police variable, remplacez les valeurs fontFamily et gardez les slugs.

### Fonctionne-t-il pour les sites de droite à gauche ?

Le fichier ne contient aucune valeur gauche ou droite : couleurs, tailles et familles de polices sont indépendantes du sens d'écriture. Vérifiez séparément votre police de repli pour l'arabe ou l'hébreu, car les piles système varient selon les plateformes.

### Où placer le fichier dans mon thème ?

Enregistrez-le sous le nom theme.json à la racine d'un block theme, puis ouvrez l'éditeur de site. Les entrées de palette apparaissent dans le sélecteur de couleurs, les tailles dans le panneau typographie, et la section styles définit les valeurs par défaut de tout le site.