Créer et modifier la palette du site

La palette donne des couleurs communes aux éléments du site. Un bouton peut utiliser une nuance de Principal, tandis qu’un fond utilise une nuance de Neutre. Modifier ce rôle permet de garder un ensemble cohérent.

1. Ouvrir la palette

Dans Design, ouvrez Thème, vérifiez le thème choisi puis cliquez sur Couleur.

Les couleurs principales sont Principal, Secondaire, Tertiaire et Neutre. Commencez par Principal pour votre couleur dominante, puis choisissez des couleurs complémentaires et des neutres lisibles.

Les couleurs sémantiques servent à porter un sens : Danger, Info, Succès et Avertissement. Préservez ce sens dans les messages, même si vous adaptez leurs couleurs à votre identité.

2. Comprendre les nuances

Chaque rôle contient une famille de nuances numérotées, de 50 à 950. Dans une palette habituelle, les petits numéros sont plus clairs et les grands plus foncés. La nuance 500 sert de base.

Deux éléments utilisant Principal peuvent avoir des nuances différentes. Modifier seulement Principal 500 ne change donc pas forcément un bouton qui utilise Principal 600. C’est normal : il ne s’agit pas de la même valeur.

3. Modifier une nuance seule

Décochez Palette automatique sur le rôle à modifier. Cliquez sur la pastille de la nuance voulue, puis choisissez sa couleur dans le sélecteur visuel.

Les autres nuances restent indépendantes. Ce mode convient si vous avez une palette précise ou si vous souhaitez ajuster un contraste sans refaire toute la famille.

Dans la vidéo, nous modifions uniquement 500 et vérifions que 600 reste identique.

4. Générer une palette cohérente

Cochez Palette automatique, ouvrez la couleur de base et choisissez une nouvelle couleur. Les nuances du rôle sont alors générées ensemble.

Cette génération remplace les nuances de ce rôle. Si vous aviez ajusté plusieurs nuances manuellement, notez-les avant de repasser en automatique.

Le sélecteur accepte aussi une valeur Hex, composée d’un # et d’un code couleur. Si vous connaissez votre couleur de marque, vous pouvez la coller en une fois. Vérifiez toujours la valeur finale affichée et la couleur obtenue.

5. Contrôler le vrai résultat

Regardez les boutons, les liens, les fonds et les textes qui utilisent la palette. Un élément ayant une couleur locale ou une autre nuance peut rester inchangé.

Vérifiez les textes clairs sur fond clair et les textes foncés sur fond foncé : ils risquent de devenir difficiles à lire. Une couleur ne doit pas être le seul moyen de comprendre un message important.

Comparez plusieurs pages, puis les formats mobile et tablette. Enregistrez et contrôlez le staging avant la publication publique.

Pour modifier la couleur d’un seul texte, utilisez ses réglages de lisibilité.