🎨Paramétrer les couleurs des catégories

Pour rendre l'Etat des lieux de chaque dossier plus agréable à lire, vous pouvez utiliser des couleurs pour chaque section. Vous trouverez en bas de page une proposition de palette à utiliser.

Quelles couleurs ?

Vous pouvez définir une couleur pour chaque catégorie de questions de votre questionnaire. Ces couleurs seront utilisées sur la page Etat des lieux qui restitue les réponses aux questions (titres des catégories et boutons qui invitent à remplir les catégories incomplètes).

Les couleurs sont utilisées pour les titres des catégories et les boutons qui invitent à remplir les sections incomplètes.

Comment paramétrer ces couleurs ?

Depuis l'Admin > section Configuration > Questionnaire > la liste des catégories de questions s'affiche ("groupes de question").

Vous pouvez soit créer un nouveau groupe de questions, soit cliquer sur l'un des existants puis le modifier (bouton Editer en haut à droite). Le champ Couleur est à la fin du petit formulaire.

Quelles couleurs peut-on utiliser ?

Vous pouvez désigner certaines couleurs par leur nom commun (ex : orange). Cependant c'est les couleurs par défaut du navigateur dont le rendu est généralement... visuellement discutable.

Sinon, vous pouvez désigner les couleurs souhaitées par leur code hexadécimal ce qui vous ouvre une palette extrêmement large.

circle-info

Le code hexadécimal d'une couleur est composé de # suivi de généralement 6 caractères. Par exemple, le noir correspond au code #000000 et le rouge #FF0000.

Vous pouvez par exemple utiliser ce sitearrow-up-right pour choisir une couleur et obtenir le code hex correspondant.

circle-info

Pour des questions de lisibilité et de constraste, il faut veiller à ne pas utiliser des couleurs trop claires. Evitez aussi les couleurs trop criardes par respect pour les yeux de vos visiteurs ;)

Suggestion de palette de couleurs

Vous pouvez utiliser la palette de couleurs suivante, pour laquelle nous avons vérifié le contraste.

  1. #5e71b0

  2. #965287

  3. #be7479

  4. #c86b14

  5. #ca7702

  6. #6a7b2d

  7. #427b5d

  8. #0a838a

  9. #054245 (ajouté après création de la palette, plus foncé que le n°8)

Mis à jour