Comment changer la couleur des hyperliens en mode Sombre

Lorsqu’une couleur primaire foncée est définie pour votre site de base de connaissances, la même couleur est appliquée en mode Clair et Sombre. En mode sombre, cela peut rendre les hyperliens partiellement visibles ou difficiles à distinguer du texte environnant car la couleur du lien se fond dans le fond sombre. Vous pouvez résoudre cela en supplantant la couleur du lien hypertexte uniquement pour le mode Sombre, en laissant les liens en mode Clair inchangés.

Quand utiliser cette correction

Couleur principale foncée avec le mode Sombre activé : si votre site Knowledge Base utilise une couleur de marque foncée (comme bleu marine, vert foncé ou gris foncé) et que les lecteurs peuvent passer en mode Sombre, les hyperliens peuvent sembler difficiles à lire.
Problèmes d’accessibilité : un faible contraste entre la couleur du lien et l’arrière-plan en mode sombre peut rendre la navigation difficile. Une couleur de lien plus claire et à fort contraste améliore la lisibilité pour tous les lecteurs.

NOTE

Ce changement CSS n’affecte que les hyperliens en mode Sombre. Les couleurs des liens en mode lumière ne sont pas affectées.

Petite référence

Utilisez cet extrait pour la version de votre site de base de connaissances. Remplacez-le red par la couleur que vous souhaitez obtenir.

html[data-bs-theme=dark] d360-article-content a {
    color: red !important;
}

Comment changer la couleur du lien hypertexte en mode Sombre

Dans le portail de la Base de connaissances, allez dans Paramètres > site de la Base de connaissances > CSS & JavaScript personnalisés.

Knowledge base site settings page showing the Custom CSS and JavaScript option in the left navigation.

Sélectionnez l’onglet CSS et collez l’extrait pour la version de votre site de la base de connaissances à partir de la référence rapide ci-dessus.
Remplacez red par la couleur souhaitée — utilisez un code hexadécimal (par exemple) #66b2ffou un nom de couleur CSS. Choisissez une couleur avec suffisamment de contraste avec votre fond sombre.
Cliquez sur Enregistrer.

Custom CSS editor showing the Dark mode hyperlink color snippet pasted in the CSS tab with the Save button visible.

Conséquences

Après avoir sauvegardé le CSS, les liens hypertextes en mode sombre s’affichent dans la couleur spécifiée, les rendant clairement visibles sur le fond sombre.

Knowledge Base site in Dark mode showing hyperlinks rendered in a custom color that is clearly visible against the dark background.

Meilleures pratiques

Choisissez une couleur claire et accessible pour le mode Sombre : les couleurs qui fonctionnent bien en mode Clair (comme le bleu #0056b3foncé) ont souvent un contraste insuffisant en mode Sombre. Utilisez une teinte plus claire de la couleur de votre marque, comme #66b2ff pour le bleu ou #80d080 le vert, afin d’assurer la lisibilité.
Vérifiez le contraste avec un outil : utilisez un vérificateur de contraste (comme WebAIM Contrast Checker) pour vérifier que la couleur de lien choisie répond aux exigences de contraste WCAG AA par rapport à votre couleur de fond foncée.
Testez dans les deux modes après la sauvegarde : basculez entre le mode Clair et le mode Obscur sur le site de la base de connaissances pour confirmer que la correction ne modifie que les liens du mode Sombre et n’affecte pas l’apparence du mode Clair.